Post on 08-Sep-2014
description
How to build WordPress sites efficiently with existing themes and plugins
About me and the companyDat Hoang
● Community & Support of OnTheGoSystems
● Marketing Online
OnTheGoSystems
● WPML● Toolset plugins● ICanLocalize
Agenda
● What makes a good website● Do I need to be a graphic designer?● Do I need to be a programmer?● How to build nice sites with existing themes
○ where to search themes○ tips and hints for choosing themes○ tips for non-programmers for theme customisation
● How to extend site functionality with plugins○ most wanted plugins○ tips and hints for searching plugins
What makes a good website?
What makes a good website
Content
Good content features● unique● clear message● meeting your
visitors expectations
How to provide good content● learn how to write
for web● choose a theme
which helps you to achieve your goals
Write for web, make your content scannable
Some good practices:● keep your
paragraphs short● use intertitles● use bullet-point lists● use deep captions● use pictures
source: http://www.copyblogger.com/scannable-content/
Expose your content with theme features
● calls to action● pricing tables● testimonials● services● progress bars
pictures come from Lounge theme, source: http://themeforest.net/item/lounge-clean-elegant-wordpress-theme/full_screen_preview/4616086
What makes your site look attractive
Design
● typography● colors● good layouts● attractive pictures● consistency● special effects● responsiveness
picture comes from Extremis theme, source: http://themes.themegoods2.com/extremis/
How to design a good website?
A challenging path● become a graphic
designer (to design)● become a
CSS/HTML/js programmer (to implement)
An easy path● find a good theme● learn how to
customise it
What makes your site functional
What makes your site functional
From a visitor point of view● easy navigation● search● galleries● contact forms● newsletters● social media
integration
● From a site owner point of view
● easy content maintenance
● security● backups● performance● SEO
How to provide a functional website
A challenging path● become a web
programmer
An easy path● find appropriate
plugins● learn how to use
them effectively
Creating sites using an easy route approach
Steps1. Learn WordPress2. Find a theme3. Customise it4. Provide valuable content5. Extend the functionality with plugins
All resources are within your reach
source: http://naswp.cz
How to learn WordPress: possibilities
“Tell me and I forget, teach me and I may remember, involve me and I learn”
Benjamin Franklin
1. Start for free with WordPress.com
2. Find (free) hosting a. with WordPress
installed automatically
b. install WordPress yourself
3. Install WP on your localhost
wordpress.com: good for the start
Advantages● free● backups done
automatically ● no software
maintenance● always live, always
fast● jetpack: a kit full of
useful features
Limitations● limited themes● no outside plugins ● ads placed on your
site● no FTP access to
files (no custom php coding)
localhost - a website on your own PC
How to have a localhost● XAMPP● Appserv● MAMP PRO
For Mac
Making your site attractive with themes
Searching for themes
1. Free themes in WordPress.org repository
2. Free commercial themes
3. Premium themes
Searching WordPress theme repository
Use filters
Commercial yet free: a good compromise
Source: http://gavickpro.com/
Commercial yet free: a good compromise
source: http://www.woothemes.com/
Commercial yet free: DesignWall (VN)
source: http://www.woothemes.com/
Premium themes
Popular theme stocks● ThemeForest.net● ThemeplateMonster.
com● MojoThemes.com● AppThemes.com
picture comes from http://themeforest.net/
Premium themes: what to expect
● very good design● easy to customise● rich sliders● fully responsive● demos and sample
data (xml)● rich documentation
including videos● wooCommerce and
WPML supportpicture comes from the7 theme, source: http://themeforest.net/item/the7-responsive-multipurpose-wordpress-theme/5556590
Choosing a theme: tips and hints
● theme flexibility saves your time
● check author credibility
● watch the pictures● watch the fonts
Multipurpose themesfree● Responsive● Attitudepremium● Avada● Enfold● X - The Ultimate
WordPress Theme
A tip: fill in your site with example content
● use WP Example Content (or similar) plugin
What elements need checking?
● Headings: h1, h2, h3… tags ● Bullets● Page/post designs, ● Widget● Fonts (change it easily or not, the fonts
support UTF-8 or not)● Responsive - MOST IMPORTANT IN MULTI-
SCREEN AREA
Nice pictures and fonts: so far so good...
source: http://themeforest.net/item/newsroom-responsive-news-magazine-theme/3357554
Disable images and switch to default font
source: http://themeforest.net/item/newsroom-responsive-news-magazine-theme/3357554
Customising your theme: a step further● useful plugins
○ Google fonts○ custom CSS○ drag & drop
functionality (Layouts plugin)
● learn CSS and inspecting tools
● learn how to create a child theme
Making your site functional with plugins
Most wanted
Most wanted functionality for business websites:● under construction● contact forms● nice effects for galleries● social media integration● newsletters● security and backups● SEO and statistics● speeding up
Most popular WordPress plugins
source: http://plugintable.com/
Under construction
source: https://wordpress.org/plugins/ultimate-coming-soon-page/
Contact form 7
● easy to install and configure
● lots of options● non-official WP
standard for contact forms (themes are compatible with)
picture comes from http://makiety.olkusz.pl/ site, based on Roya theme
Lightbox effect for galleries
How to create galleries ● use WordPress
native gallery● add a plugin for
lightbox effectLightbox plugins● Easy FancyBox● Gallery Carousel
Without JetPackpicture comes from: http://wordpress.org/plugins/easy-fancybox/
Newsletters and new posts notifications
MailPoet plugin● easy to configure● drag and drop
newsletter editor● sends your latest
posts automatically● Gmail, iPhone,
Android, Outlook, Hotmail support
source: https://wordpress.org/plugins/wysija-newsletters/
Schedule automatic backups with plugins
BackWPup● decide what to
backup● decide where to
store your backups● backups scheduled
or made on demand
source: https://wordpress.org/plugins/backwpup/
Secure your site with iThemes SecurityExample plugin features● Renames "admin"
account● Changes the URLs for
WordPress dashboard ● Changes wp-content
path● Changes the WP
database table prefix● Registers bad login
attemptssource: https://wordpress.org/plugins/better-wp-security/
SEO plugins: rank high in SERP
The things to consider:+ sitemap+ rel=canonical+ social tags+ customized title and description
Recommendation plugins: + WordPress SEO+ All in One SEO Pack
Searching for a good plugin: tips & hints
● ratings● reviews● number of
downloads● support● if plugin author
builds a business around a plugin, it’s a good sign
pictures come from https://wordpress.org/plugins/events-manager/
Extending WP functionality: a step furtherWhat to use: some ideas ● different elements on the
sidebars for some posts or pages
● custom post types and taxonomies
● custom fieldsUseful Free Plugins● Custom sidebars● Types
DiscussionQ & A
Big Thanks!Dat HoangCommunity & Support Vietnam E: dat.h@icanlocalize.comW: wpml.org | wp-types.com | icanlocalize.com
Saigon, July 12, 2014