20

Click here to load reader

10 basic steps to word press theme customization

Embed Size (px)

Citation preview

Page 1: 10 basic steps to word press theme customization

10 Basic Steps to WordPress Theme Customization

By

Page 2: 10 basic steps to word press theme customization

About me

● Hi! I am Tristan Khalil and I am the owner of TRIZZONE.

● I love gaming, photography, listening to music and even watching movies. I also love to explore new places.

● When I am in front of my computer, I am doing some administrative tasks such as social media promotion, WordPress management, doing some graphic design project and more.

● TRIZZONE is my porfolio website and blog. I am blogging about freelancing, social media, SEO and virtual assistance.

● You can follow me at www.about.me/triz

Page 3: 10 basic steps to word press theme customization

GlossaryAdmin BarThe admin bar is an area of the screen just above your site that lists useful admininstration screen links such as add a new post or edit your profile. The admin bar concept was added to WordPress in Version 3.1 and was replaced by the Toolbar in WordPress Version 3.3. Each user can use Administration > Users > Your Profile to turn on (or off) the admin bar when viewing the site or the Dashboard.

Back EndThe back end is the area that authorized users can sign into to add, remove and modify content on the website. This may also be referred to as “WordPress”, "admin" or “the administration area”.

CategoryEach post in WordPress is filed under a category. Thoughtful categorization allows posts to be grouped with others of similar content and aids in the navigation of a site. Please note, the post category should not be confused with the Link Categories used to classify and manage Links.

ContentContent consists of text, images, or other information shared in posts. This is separate from the structural design of a web site, which provides a framework into which the content is inserted, and the presentation of a site, which involves graphic design. A Content Management System changes and updates content, rather than the structural or graphic design of a web site.

Page 4: 10 basic steps to word press theme customization

GlossaryDashboardIn WordPress a Dashboard is the main administration screen for a site (a weblog), or for a network of sites. It summarizes information about the site or network, and also external information, in one or more widgets that the Dashboard user can enable, disable, and move around.

Front EndThe front end is what your visitors see and interact with when they come to your website, www.YourSite.com.

PageA Page is often used to present "static" information about yourself or your site. A good example of a Page is information you would place on an About Page. A Page should not be confused with the time-oriented objects called posts. Pages are typically "timeless" in nature and live "outside" your blog.

PermalinkA permalink is a URL at which a resource or article will be permanently stored. Many pages driven by Content Management Systems contain excerpts of content which is frequently rotated, making linking to bits of information within them a game of chance. Permalinks allow users to bookmark full articles at a URL they know will never change, and will always present the same content.

Page 5: 10 basic steps to word press theme customization

GlossaryPermalinks are optional in WordPress, but are highly recommended as they greatly increase the cleanliness of URL.

PostAlso known as “articles” and sometimes incorrectly referred to as “blogs”. In WordPress, “posts” are articles that you write to populate your blog.

ShortcodeA Shortcode is a technique for embedding a snippet of PHP code into the body of a page or other content item.

SidebarA sidebar is a vertical column provided by a theme for displaying information other than the main content of the web page. Themes usually provide at least one sidebar at the left or right of the content. Sidebars usually contain widgets that an administrator of the site can customize.

WidgetIn WordPress a widget is a self-contained area of a web page that performs a specific function, or the code that generates such a self-contained area. For example, WordPress has a built-in widget that displays a list of pages in a weblog's sidebar, and it has another built-in widget that displays a list of recent comments in the Dashboard. Plugins and themes can provide additional widgets.

Page 6: 10 basic steps to word press theme customization

Questions from our attendees:Is there a Social Media Metrics for Wordpress? - Carissa

Yes, just searchin the plugin repository for "Social Metrics". Social Metrics is a Social Media Analytics tool you can use to track your WordPress blog performance on popular social networking websites and services.

How can I use this as my advantage on my Virtual Assistant career? - ArnelNowadays, most Internet Marketeers and Small Businesses uses WordPress as their website

platform because it's easy to setup, maintain and customize for their branding.

Can these customization be applied to wordpress.com as well? - JovellSadly, not all. WordPress.com are very limited compared to self-hosted WordPress.

Is each of the 10 themes designed or suited for a specific type of blog (e.g. business, personal, information sharing, different types of on line biz, etc)? - Ron

Just to make it clear, we will be discussing about the steps on how to customize a WordPress theme. It will depend on what kind of WordPress site your are developing. I'll try to cover some themes for blogging, business, porfolio and landing page.

How can i delete the auto saved post in my free hosted WP? - DheyI'm not so sure about this one. Meron lang auto-save feature ang WP but you can delete the post

naman if you want.

Page 7: 10 basic steps to word press theme customization

Questions from our attendees:What's the best wordpress theme? - Christian

There's no best WordPress theme. But one thing that I will recommend is to use responsive themes.

How to add and use widgets? - PerseusWidgets will depend on the theme you are using. Some themes might have more widgets than

others. As for their usage, we will discuss that here as it is part of the customization.

Please give details about how WordPress works. - EloisaWordPress can work as a blog, portfolio site, tumblog, landing page or a full-blown business

website.

WordPress Proper Coding. - Jan DaryllThere's no proper coding for WordPress. But you can install Better WP Minify to group together

scripts and codes. This will help faster page loading. Another thing is that if you will be inserting a script, try to insert it in the footer area, rather than the header as usually what they instruct you to do.

Is it worth it? - RichardIt depends on you. If you love customizing website. Then this might be something you will love

doing.

Customizing WordPress to be responsive. - NicaThe secret of a responsive theme is that it's ability to fit in any width, we call that fluid theme.

Page 8: 10 basic steps to word press theme customization

Let's Begin!

Page 9: 10 basic steps to word press theme customization

1. Prepare your WordPress Site.

- Install Ultimate Maintenance Plugin and set your Privacy to "Not index/crawl". - You might want to do it first in a subdomain or in your PC (via XAMP).

Page 10: 10 basic steps to word press theme customization

2. Select a theme.- You might want to select what theme you want to use. You can check the WordPress Theme Repository or search online for themes. - Stay away from using themes are are not provided by the developers website. - You can get free themes from Themeforest.net, WooThemes, ThemesKindgom, WPMU and among others. - Fluid themes are best responsive themes.

Page 11: 10 basic steps to word press theme customization

3. View the DEMO Theme

- Check every pages of the theme. - Pinapakita kasi nila yung mga features na kayang gawin ng theme.- Check the homepage, inner pages, contact page, portfolio, blog, etc.- Check the header, footer and sidebars.

Page 12: 10 basic steps to word press theme customization

4. Look for the theme's documentation.

- Always look for and read the theme's documentation. - The theme's documentation will serve as your "Quick Guide" or "User Manual"- Follow the steps on setting up the Homepage, Portfolio Page, Contact Page, Blog Page etc.

Page 13: 10 basic steps to word press theme customization

5. If still at lost, use the dummy files provided.

- Most of the time, dummy or sample file is provided together with the theme to help you setup theme just like what you can see on their demo site.- Dummy/Sample file provided have shortcodes and may include link to the demo images. - Upload your own images and do not hotlink images from the demo site.

Page 14: 10 basic steps to word press theme customization

6. Using the dummy file/data, edit the pages to what information you want to be posted.- Of course you need to edit each pages or posts.

Page 15: 10 basic steps to word press theme customization

7. Know the Shortcodes

- It would be wise if you know some of the basic shortcodes. - Shortcodes are your friends when doing some customization.- Example of a shortcode: [button]Click me![/button]

Page 16: 10 basic steps to word press theme customization

8. Expect to do Trial and Error.

- You will need to save and check the front-end to see how it looks like with the changes you've made.

Page 17: 10 basic steps to word press theme customization

9. Always refer to the documentation or demo site

- Should you bump into something that you can't get the thing you want, refer to the documentation or check the demo site for what code was being used.

Page 18: 10 basic steps to word press theme customization

10. If you think you can't proceed on customizing, ask the developer or WordPress Pro/Experts.- This is what I like about getting themes from the developer because they will provide you with support either via email or forum.- There are many WordPress groups in Facebook that you can ask for help.- Example groups are WordPress for Business and WordPress Design & Development.

Page 19: 10 basic steps to word press theme customization

Question & Answer

Please TYPE your questions in the chat box.

Thanks

Page 20: 10 basic steps to word press theme customization

Visit my website @

www.tristankhalil.com