Change Agent

I view myself as a change agent somewhere in the social media, public perception field. I am interested in learning more about WordPress.org, social media, and how to tie everything in together with branding. It is important to continue learning in this field, and specialize.

The technologies I found most important in this class was WordPress of course, it is where we wrote every blog.

As far as structure goes I very much enjoyed the beginning when we were gathering as a group to share thoughts and opinions with each blog post.

FlowerPetalFocus

Ben,

Thank you for teaching the classes through this semester, and having our backs. It has been a pleasure to have you as a professor, and I’m pretty sure I am speaking for everybody who has been in your class. I know you are just beginning to get into the groove of being a professor, but you have an energy and corkiness about you that makes having you as a professor a good experience. I like the fact that you are always prepared and on time too.

I will have Jonathan next semester for two classes so he will get some kind of pep/thank you talk then…haha…don’t tell him though. I feel weird I am not graduating now because many of the people I formed a bond with in school are leaving so my heart is a bit sad, for I will miss them, but mostly full of Joy and excitement to see what they accomplish.

Good Luck in your future years of teaching AND Enjoy every ounce of Summer!

Candice

Missing Sticky

A new industry trend that is expected to continue into 2014 and 2015 is the sticky menu. It is beneficial for the user to constantly be able to access the navigation, while scrolling down a page…especially with a one page website.

The sticky menu is very easy to implement with WordPress, as there are several plug ins that can be found with a simple search.

Sticky Menu Plugins:

StickyHeader by TomatoSoup  (The information below was sourced from  link)

  • Menu – You need to create at least one navigation menu before you can add it to Sticky Header. The menu in Sticky Header shows only first level items, so no submenu items will be shown.
  • Logo – You can upload your sticky header logo by clicking on “Upload new” > “Select a file”. Ideally, this logo should be 30px tall or it will be resized. If a logo image is not uploaded, site title will be used.
  • Background color – You can choose your custom sticky header background color.
  • Text color – Choose your sticky header text color so it provides enough contrast with regards to the background color.
  • Sticky Header max width – This option allows you to match interior Sticky Header width to your content area width.
  • Make visible when scrolled to – This is the distance from the top of the page at which sticky header will show, in pixels.
  • Hide if screen is narrower than – Sticky header will not be shown on screens narrower than this value, in pixels. When people use mobile devices, they’re used to vertical scrolling so it’s not necessary to have sticky headers.

LowerMedia Sticky.js Menu’s (The info below was sourced from link)

Plugins tested to work with this theme work a tad bit differently. Instead of adding a class it uses custom js files that have the main navigational selectors already defined. JS manipulates the menus by using the already defined tags.

This plugin has been tested on a growing number of themes including: (will, in most cases, work on themes other than the following as well) twentythirteen, twentytwelve, twentyeleven, responsive, wp-foundation, required-foundation, neuro, Swtor_NeozOne_Wp, lowermedia_one_page_theme, expound, customizr, sixteen, destro, swift basic.

 

Sticky Menus In Use:

StickyMenu1

 stickymenue2

Sliding Home

The Goal: Add an image slider to your website or blog. 

Using WordPress there are hundreds of options for image slider plugins.  Doing research resulted in finding many resources to help you choose the slider best fit for you.  Check out these links!

10+ Best Free WordPress Slider Plugins 2014  – short description of capabilities and download button.

125 Best WordPress Slider Plugins 2014 – offers demos and more info of each slider featured in article.

Best Slider Plugin – itemized list of features and download button.

MetaSlider

Snap - 2014-04-22 20:21:33

 

Steps to Install:

  1. Click on plugins
  2. Search for ‘MetaSlider’
  3. Install now
  4. Activate
  5. On the left hand menu there is a new tab called ‘Meta Slider’
  6. Across the top will be tabs, Click the ‘+’ sign will create a new slider
  7. On the right hand corner you can select which type of slider you want
  8. Click ‘Add Slide’ which will bring you to your media library
  9. Choose which images you want included in the slider and click ‘add to slider’
  10. ‘Save’
  11. Grab the short code at the bottom right
  12. Click on ‘pages’ tab on the left menu
  13. ‘Edit’ page of choice
  14. Paste shortcode where wanted in page, click ‘update’
  15. Refresh page, and the slider is in the page

 

 Criteria to consider when choosing which slider plugin you want:

  • Is it responsive?
  • Do you need the ability to have textual content?
  • Is the background Customizable?
  • Is there Search Engine Optimization?
  • When was it last updated?

 

Based on the tutorial I watched about the Meta Slider, and reading through many others based on several of the top rated slider plugins there are many that are easy for the user and designer.  The interface for Meta Slider is incredibly simple to figure out, with a few clicks of the mouse and choices of images a working slider can be placed in your website.

 

 

Contact Form Contact Form Contact Form

Contact Forms can be coded using HTML and CSS pretty simply…BUT even easier is using a plugin with WordPress!

Three  contact form links for  plugins available for contact forms on WordPress.

Contact Form 7

Capture contactFormTab

Contact Form 7 features:

  1. Responsive – will look sharp using 100% of the screen on every device, without jerky points.
  2. Ready-Made Skins – many skins in different color schemes are included.  This can be a great starting point for unique custom designs.
  3. Spam Filtering – using the Akismet WordPress plugin.

Con: Could use a few templates to choose from, to modify the design means playing with the CSS…which could be challenging for people just keeping up with a blog and avoiding code writing.

Fast Secure Contact Form

FSCFpluginBuilding FSCFInAction

Fast Secure Contact Form Features:

  1. Admin Interface – has an interface, shown above, where one can create and preview unlimited forms.
  2. Spam Filtering – using the Akismet WordPress plugin.

 

Ninja Forms

Snap - 2014-04-22 17:47:48 Snap - 2014-04-22 17:48:52

Ninja Forms Features:

  1. Admin Interface to easily add in and name new fields
  2. Email results of form to any number of pre-determined email addresses
  3. Anti-Spam

Other Add-ons for Ninja Forms:

  • Stripe – Accept Payments
  • Modal Forms – Open Ninja Forms with clean modal pop-up
  • Text Message Notification – Notifications when a form has been submitted
  • HubSpot – Submissions to HubSpot for customer data collections and smart sorting

Questions important to me when considering a plugin:

Is the plugin easy to style?

What add-ons are available for the plugin?

Does the plugin have a spam filter available?

Is the contact form responsive?

What are the ratings?  Read a few to see what users really think!

Is the Contact Form easy to access from the WordPress Interface?  Is there a tab?
With regards to users, I feel all the above platforms are simple to understand,  with well labeled inputs and buttons.  With regards to designers I feel Contact Form 7 is best, seeing how it brings one into the code straight away.  A designer benefits most by getting into the code instead of using an interface  to set up everything.   Although the interface is convenient, and could benefit designers who do not want to mess with code writing, it is nice to really have an understanding how your site is working…even with just the contact form.

To Template or not to Template?

SOOOO…Use a Template or Design Your Own?

Which approach is better….use an existing template or design your own?  This is a question some people wonder about when beginning a blog or using a CMS for their website.  The answer is it depends on what you are intending to use it for AND how much experience you have working with code!

Currently I am in two different classes with different final project expectations.  In one class we are re-branding a local business, including building their website; the other we are producing a personal portfolio of the best works through our college career.  The business has requested I use WordPress so they can easily add content and keep their website updated.  In this case I will design a unique theme for their business.  Due to time constraints, with my personal portfolio, I will choose a template and modify it until I have more time during the summer to work with producing a theme.  If any CMS site is going to be used just as a blog, I think using a template would be acceptable.  If one is producing professional work as a website developer, it should be their own theme.  We are not hired by companies to just place their material in a template…unless it is of our own design.

Design resources that could be useful:

  • Web Design Ledger.  – This site is useful for pulling ideas and resources starting with building a logo, completing the wireframes, conducting user testing, and keeping your web designs unique and noticeable.
  • Google – Google People!  Type in anything you want…best web designs 2014, unique web design 2013…doesn’t matter you will get thousands of results to sift through and great ideas result.
  • AWWWARDS – Design, layout, features, content.  Ideas for everything here…these are websites that have been recognized by industry professionals as being the best.  Ideas galore!

Resources Specifically for CMS:

Snap - 2014-04-13 22:06:02

Tweak the Code, Add the Plugins

With an existing WordPress theme one can go in and modify code any way they like, and add plugins for different design or functionality features.  As the WordPress site says “That is the beauty of free software, free refers not only to price but also the freedom to have complete control over it.”

Best Themes to Customize

  • Toolbox
    • Bare Bones Code
    • Supports HTML5
    • Well-Known blank theme
  • Bones
    • Built using HTML5
    • Well organized CSS Files
    • Available in Classic OR Responsive
  • Thematic
    • Grid-based layout
    • Modular CSS
  • Whiteboard
    • More dynamic classes and IDs than any other free WP framework
    • Flexible div structure
  • Starkers
    • No non-semantic markups
    • Totally blank, ideal for developing your theme based on it

 

Just the Beginning, WordPress.

Is this the beginning of a love or hate story?  I’m hoping love.

The CMS I am choosing to learn over the next month is WordPress.  I want to learn how to build themes, effectively use widgets and plugins.

Why WordPress?

Coming to this conclusion has been a couple of months in the making.  I have spoken with two professionals in the website building and app producing field, two professors, several fellow students, and many other friends.  After reading dozens of articles, writing twelve blogs, finding hundreds of images, over thirty links…den de de daaaa…WordPress is the WINNER. WINNER. WINNER.  Big Surprise right?

After talking with an acquaintance who works designing and coding apps for Macintosh, plus produces several websites a month, he advised me to learn Bootstrap.  After professors advised learning a CMS before Bootstrap my friend said WordPress or Drupal.  With less than a month to build a static website AND learn how to make a theme I choose WordPress, as I heard the Drupal can take some time to really get an understanding of how to use it properly.

While reading articles on Smashing magazine and other technology gurus blogs it seemed that WordPress is going strong as an industry standard.  Currently, according to statistics, WordPress is still the most widely used CMS.

Top Reasons to use WordPress:

1. The Learning Curve is Just Right 

Once your theme is created the client will use an interface to create new post with minimal instruction.  Uploading images is simple as well.

2. Superb Plug-Ins

Quickly adding functionality using the huge selection of plugins is wonderful. Most of the plugins are downloaded, installed, and configured in minutes.

3. Updates Keep Coming

Being that WordPress is so popular, updates will continue. This means that WordPress is a constantly evolving and improving system.

4. SEO is Made Easy

Several features such as Google XML Site Map and the All-In-One SEO pack will force you to maintain good SEO discipline.

All Designers Need To Learn?

All designers need to learn one of the three industry standard Content Management Systems.  This means…choose WordPress, Drupal, or Joomla and learn it!  Besides, I have had several people tell me if you can figure one of them out, you can figure them all out.

 

Content Management System Feedback

Rating Two Content Management Systems

Scale of 1-10, 10 being best

Get Simple: 6

With a better understanding of database driven content management it took longer than expected to install and template in Get Simple.  The reason I give it a 6 though, is editing was very simple.  Once importing images, and other pertinent files making everything come together and editing the material was quick inside of the Get Simple interface.  Creating a backup for your site is as easy as clicking the ‘backup’ tab then the “create new archive now” button.  Once the archive is created simply click on the title of the archive and zipped download will commence.

WordPress: 8

WordPress is more my speed, using the database driven system.  I give it an 8, which may jump up, pending on how creating a personalized theme works. Finding installation super simple and creating content just as easy so far an 8.

Installation, Editing and Backup

Installation

With Get Simple Installation required clicking a button, UN-zipping a file, and placing the file in your computers ‘ht docs’ file within the chosen web server folder.  For WordPress, I accessed my available c-panel through HostGator, clicked the ‘WordPress’ easy instal button.  After clicking the button it asked for information and guided me through step by step instructions.  This resulted in another sign in screen, specifically to control the newly downloaded WordPress and an easy to use interface.

Editing

GetSimple and WordPress are both considered WYSIWYG platforms, so editing in both are meant to be easy enough for somebody with little to no experience easy, unless you are interested in creating your own theme that is.  In each CMS there are tabs, GetSimple tabs are nested at the top, and WordPress to the left. With Get Simple it was easy to add new pages and specify if those pages were part of the navigation and where in the navigation each are ranked.

Backup

Backup for GetSimple is easier than WordPress!  Get Simple backups are created by going to the ‘Backups’ tab, clicking ‘Create New Archive Now,’ then clicking on the title and BAM a nicely zipped file of your site is downloading to your computer.

Capture

Backup for WordPress is pretty detailed. Here are the directions per wordpress.com:

Backing Up Your WordPress Site
There are two parts to backing up your WordPress site: Database and Files. You need to back up the entire site, and you need to back up your WordPress database. Below are instructions for backing up your WordPress database for various server programs. We will start with backing up the rest of your WordPress site.

Your WordPress site consists of the following:

WordPress Core Installation
WordPress Plugins
WordPress Themes
Images and Files
JavaScript and PHP scripts, and other code files
Additional Files and Static Web Pages
All of these are used in various combinations to generate your website. The database contains your posts and a lot of data generated on your site, but it does not include the above elements that all come together to create the look and information on your site. These need to be saved.

Most hosts back up the entire server, including your site, but it takes time to request a copy of your site from their backups, and a speedy recovery is critical. You need to learn how to back up your own site files and restore them.

Here are some methods to backup your site files:

Website Host Provided Backup Software
Most website hosts provide software to back up your site. Check with your host to find out what services and programs they provide.
Create Sync With Your Site
WinSCP and other programs allow you to sync with your website to keep a mirror copy of the content on your server and hard drive updated. It saves time and makes sure you have the latest files in both places.
Copy Your Files to Your Desktop
Using FTP Clients or UNIX Shell Skills you can copy the files to a folder on your computer. Once there, you can zip or compress them into a zip file to save space, allowing you to keep several versions.
Remember, keep at least three backups on file, just in case one is corrupted or lost, and store them in different places and on different mediums, like CD, DVD, different hard drives, etc.

Use for Clients?

I would use WordPress for clients.  It has been and still is an industry standard to use WordPress, Drupal, or Joomla when building websites while using a CMS.  After reading several articles and conflicting opinions about database driven vs.  cloud based Content Management Systems I lean more toward staying with database driven, and while reading I feel most professional feel this same way.

Likes and Dislikes

GetSimple

I found Get Simple hard to get started with.  It could be that I was switching from home to school computers but when signing on sometimes it would not allow access.

Once installed and logged in the interface is very simple to navigate, using  a tab system nested at the top of your editing page.  Another feature that is nice is uploading images and placing them into the pages, it’s painless with a few clicks.

WordPress

WordPress has been around a while, so upon running into any issues googling it would resolve the problem.  I like that it is well known and used, resulting in tons of information online.

Installation was also simpler from home, using my current c-panel through HostGator it literally was a click of a button and filling in directed information, bam I was up and running!

 

 

 

 

Getting Started With WordPress.Org

Jump on board.  Lets go on a ride through the installation and set up of WordPress.org.  It ended up being quite simple actually.

Access Your C-Panel

After accessing my personal c-panel with Host Gator there was an easy installation button gleaming me in the eye.

Snap - 2014-03-12 20:18:56

Install WordPress

Once hitting the “Install” button I was brought to this screen:

WordpressWithoutPassword

As you can see I entered all the information they required, submitted and was provided with a generated password.

Accessing your Newly Installed WordPress

I followed the link to access the administration portal of my WordPress site.

Snap - 2014-03-12 20:33:44

The WordPress Interface

After logging in you are inside the admin. interface of your WordPress site!

Snap - 2014-03-12 20:35:11

Choose and Implement a Theme

The first task is to pick out a theme.  There are three default themes to choose from for free, you can find another, or create your own.  For this blog I just chose the free theme.   Later I will go further and create my own.

Snap - 2014-03-13 07:34:46

Once you choose a theme press activate theme and you have a basic designed website to which you can add content.

Find Plugins

The next task, finding Plugins and activating them.

Snap - 2014-03-12 20:46:09

After reading through the different plug ins I choose a gallery plugin and a code and content management plug in that should cut down on unnecessary code.

Snap - 2014-03-12 20:51:02

Snap - 2014-03-12 21:03:20

Snap - 2014-03-12 21:07:22

Use the Plugins to Your Advantage

Once I installed the plugins I started messing around with the first post.  Proceeding to the Posts tab and add new post.  Seeing how a plugin that was downloaded, gallery bank, displays images in a post in an aesthetically pleasing way I used it.  Not only does it display everything nicely but it is easy to maintain albums specific to each post, as opposed to uploading everything directly into WordPress.

Snap - 2014-03-13 07:59:50

Gallery bank directs one through all the step by step instructions with easy to recognize buttons and layout inside their plugin.  Inside one chooses how they want the images to appear within the post and which should be the album cover, also make sure to properly title and describe each image for Search Engine Optimization.

Snap - 2014-03-13 08:01:55

After adding three images into Gallery Bank, this is what was displayed on the webpage.  Gallery Bank is what formats the style of how the images are displayed and I rather like the mosaic layout.

The Process Was Quick!

After just thirty minutes I installed, themed, added two plug ins, used those plug ins and posted using wordpress.org.

Over the next few weeks I plan on delving into WordPress.org and it’s MANY other features.  More posts to follow!

WordPress Vs. Get Simple

With the experience gained so far I still think WordPress, a database run CMS is the best choice.  With that being said let’s take a look at both flat-file and database driven CMS’s to see the differences.

Get Simple.

Flat-File Content Management System.  A flat-file CMS stores content in XML-files and folders rather than in a database like a traditional CMS.  Get Simple has many features that can be added as plugins, such as galleries, commenting systems, blogs and social media integration, plus role-based user support.  Role-based user support means that there is control of which features are available based on which user is accessing it.

Snap - 2014-03-13 09:46:20

Advantages of Using a flat-file system:

  • Speed – does not need to connect to a database and retrieve content, so loading pages are FAST.
  • Security – databases are often the first thing hackers target, without the database that security threat is removed.
  • Simplicity – with no need to maintain a database “installation” is just a matter of uploading files.  Easier for people who are not tech savvy to update and add content.
  • Portability – a site can quickly be moved to another server without needing to export and configure a database.

With Get Simple uploading files is SIMPLE.  One just has click a button “upload files” for images and other files they want viewable on the website.  Once files are uploaded one can add them using the WYSIWYG editor interface.

WordPress.

Database Driven Content Management System.  A database driven CMS runs on queries to the database to retrieve content.  Chances are you have probably used a database-driven site without realizing it, some examples are blogging, forums, online photo galleries, and video sharing sites.

Snap - 2014-03-13 09:46:47

WordPress has been around a while and has a huge following and base of help.  Get Simple is fairly new and not as popular which is a disadvantage when trying to find tutorials and having support.

I see myself using a database driven CMS over Get Simple.  Some reasoning behind this is having taken a basic programming class, that included using databases of course, resulted in a good grasp on how to work in the database system.  After going through the set up of both types of CMS, I actually found WordPress easier…maybe it’s just the logic of it.  I know there are many plug ins for both types of CMS but in WordPress I found so many that were image based and being an image lover I enjoyed the different layouts, gallery set ups, and management available.

Project Management, sounds interesting eh?

Confusing and somewhat boring but incredibly useful and important to learn…project management.

Being a designer soft curves and circles appeal to me more than open ended lines and sharp edged boxes.  With this being said the project management styles that appeal to me work in circles and curves, with several reviews and refining in each stage.

Two types of project management styles that work with repeated cycles and smaller portions are Iterative Development and Agile Project Management.

Check out more information on Iterative Development 

Iterative_development_model_V2

Iterative Development is usually combined as a hybrid with Incremental Development for large projects.  The basic idea behind this method is to develop a system through repeated cycles and in smaller portions at a time.  This approach allows key players to learn during earlier parts of the system and reorganize accordingly.   At the end of each iteration, modifications may be made based on changing needs.

The goal for each iteration is to offer a sampling of key aspects to which the customer can react and feedback gathered.  Analysis of the iterations’ structure, usability, and achievement of goals leads minor modifications to the project control list.

Check out more information on Agile Project Management

agile

Agile Project Management(APM) takes projects a step further in breaking them down into smaller pieces.  It is easy to change direction, or be agile, when customers have changing needs.

This approach keeps the project crew and stakeholders in constant contact for information and support through decision making.  This way project crew members clearly know what is needed, allowing them to plan and make changes when they need to adjust to new situations.

Agile focuses on making the best use of limited resources and effective coaching and mentoring to build successful, high performing teams.

APM  breaks a large project into smaller sprints, if needed the sprints are broken down into features. Each sprint goes through the development stage which offers stakeholders continuous delivery of valued outcomes and satisfaction.  APM requires project teams to share information face to face on a daily basis, which allows for timely problem solving and quickly finding possible issues.  Being effective is the goal, and reflecting as a team produces adjusting focus accordingly.

Agile Approach Key Features:

  • Satisfying stakeholders through early delivery of valued outcomes.
  • Welcome changing requirements.
  • Project teams and stakeholders work closely together with ongoing communication.
  • Team meetings frequently.  Sharing information is face-to-face.
  • Project team should reflect on how to become more effective and adjust accordingly at regular intervals.

With many projects due for the remainder of the semester it will be good to incorporate the Agile Project Management style.  Each project can be considered a sprint within the ultimate outcome of a portfolio.  Meeting with three other team members on a regular basis will also help each of us in finding the issues with our designs quickly and adjusting our plans accordingly.