SlideShare una empresa de Scribd logo
1 de 54
Descargar para leer sin conexión
WORDPRESS THEME
Development
From Scratch
ICT MeetUp 2013
By : Chandra Prakash
Thapa
What is a WordPress theme?
A group of templates and a stylesheet that displays content
entered into the database via the WordPress admin.
At a minimum, you need:
 index.php
 style.css
Let’s Start
[ Get Free Responsive Template ]
 Download the brownie template from:
http://www.html5xcss3.com/2012/06/html5-template-
responsive-brownie.html
 Copy and paste the HTML design file to WordPress theme
directory.
[ wp-content/themes/brownie ]
 Rename the index.html to index.php
 Create a style.css file in brownie.
[ wp-content/themes/brownie/style.css ]
style.css
[ Template Settings ]
/*
Theme Name: Brownie.
Theme URI: http://merobox.com/
Description: This is my first WordPress template.
Author: Chandra Prakash Thapa.
Author URI: http://cpthapa.com.np/
Version: 1.0
Tags: brown, two-columns, custom-background,
License:
License URI:
General comments (optional).
*/
Go to Appearance->Themes?
Add screenshot image inside theme folder
[ wp-content/themes/brownie/screenshot.png ]
Visit the site
[ demo ]
Static Link
1. CSS : <link rel="stylesheet" href=“css/style.css" type="text/css" />
2. Script : <script type="text/javascript" src=“js/jquery.min.js"></script>
3. Images : <img src=“images/facebook.png" alt="Facebook">
1. CSS : <link rel="stylesheet" href="<?php bloginfo('template_url');
?>/css/style.css" type="text/css" />
2. Script : <script type="text/javascript" src="<?php bloginfo('template_url');
?>/js/jquery.min.js"></script>
3. Images : <img src="<?php bloginfo('template_url'); ?>/images/facebook.png"
alt="Facebook">
To Dynamic Link
Visit the site
[ again ]
A Basic Theme Requirement
 404.php - Custom “not found” page
 footer.php - The template called with get_footer()
 functions.php - A place to create custom functions, register sidebars, and other settings
 header.php - The template called with get_header()
 index.php - The default template
 home.php - The basic home template
 page.php - Overall template for pages
 search.php - Search results template
 searchform.php - The template called with get_search_form()
 sidebar.php - The template called with get_sidebar()
 single.php - Overall template for single posts
 style.css - The main stylesheet
home.phpindex.php
 Create home.php file.
 Copy all code from index.php to home.php
Break Code Into segments
[home.php]
Header.php
// Add wp_head() function before end of </head> tag.
<?php wp_head (); ?>
</head>
<body>
<header class="header_bg clearfix">
Header.php
// Add title to your website
<title>
<?php bloginfo('name'); // Title of the website ?>
<?php wp_title(); // Title of the single page or post ?>
</title>
Footer.php
// Add wp_footer() function before end of </body> tag.
<?php wp_footer(); ?>
</body>
</html>
Footer Copyright.
[ footer.php ]
 <p>
 &copy;
 <?php echo date('Y'); ?>
 <?php bloginfo('name'); ?>.
 </p>
Home.php
 <?php get_header(); ?>
 Remaining code part.(after excluding header / footer)
 <?php get_footer(); ?>
functions.php
 File is place inside theme folder.
wp-content/themes/yourtheme/functions.php
 Changes default behavior of WordPress.
 Behaves like WordPress Plugin.
 Use it to call PHP or built-in WordPress functions.
 Use to define your own functions.
 Register menu, sidebar and widgets.
Registering Menu
// registering header and footer menu in functions.php file
function merobox_addmenus() {
register_nav_menus(
array(
'header_nav' => 'Header Menu',
'footer_nav' => 'Footer Menu'
)
);
}
add_action('init', 'merobox_addmenus');
A look into menu (3.6 version)
Displaying menu (footer menu)
<div class="menu">
<?php
if (has_nav_menu('footer_nav')) {
wp_nav_menu(
array('theme_location' => 'footer_nav')
);
}
?>
</div>
Displaying menu
[ header menu ]
<?php
if (has_nav_menu('header_nav')) {
wp_nav_menu(
array(
'theme_location' => 'header_nav',
'container' => 'nav',
'container_class' => 'main-menu'
)
);
}
?>
Theme options
 Option Framework add theme options panel.
 http://wordpress.org/plugins/options-framework/
 Download -> Install -> Activate.
Add Options.php
 Download optons.php file from link below :
 https://github.com/devinsays/options-framework-
plugin/blob/master/options-check/options.php
 Add options.php file in the theme folder brownie.
Dynamic text content
Dynamic text
[ option.php ]
 $options[] = array(
 'name' => __('Why Line one', 'options_check'),
 'desc' => __(' Why to choose your business line one.', 'options_check'),
 'id' => 'why_line_one',
 'std' => 'Default Text',
 'type' => 'text‘
 );
Dynamic text display [ home.php]
 Add the following code to display previously added content.
<p>
<?php echo of_get_option('why_line_one'); ?>
</p>
Dynamic Image Slider
[home.php]
 The Query
 The Loop
 Reset Query
Dynamic Image Slider
[ Post Thumbnail Support]
// Add post thumbnails support in functions.php file
add_theme_support( 'post-thumbnails' );
// default thumbnail size for photo gallery
set_post_thumbnail_size( 281, 140, true );
//thumbnail size for image slider
add_image_size( 'image_slide_thumb', 940, 360, true );
Dynamic Image Slider
<ul class="slides">
<?php
$slider_cat = of_get_option('image_slider');
// The Query
query_posts( 'posts_per_page=5&cat='.$slider_cat );
// The Loop
while ( have_posts() ) : the_post();
?>
<li>
<?php the_post_thumbnail('image_slide_thumb',true); ?>
<p class="flex-caption"><?php the_title(); ?></p>
</li>
<?php
endwhile;
// Reset Query
wp_reset_query();
?>
</ul>
Dynamic Image Slider
[ The Query ]
<ul class="slides">
<?php
// The Query
$slider_cat = of_get_option('image_slider');
query_posts( 'posts_per_page=5&cat='.$slider_cat );
[ The Option Panel ]
$options[] = array(
'name' => __('Image Slider', 'options_check'),
'desc' => __('Catgory to use for image slider', 'options_check'),
'id' => 'image_slider',
'type' => 'select',
'options' => $options_categories);
Dynamic Image Slider
[ The Loop ]
// The Loop
while ( have_posts() ) : the_post();
?>
<li>
<?php the_post_thumbnail('image_slide_thumb',true); ?>
<p class="flex-caption"><?php the_title(); ?></p>
</li>
<?php
endwhile;
Dynamic Image Slider
[ Reset Query ]
// Reset Query
wp_reset_query();
?>
</ul>
Featured Content
[home.php]
Featured Content Settings
[ The Option Panel : options.php]
$options[] = array(
'name' => __('Featured Page one', 'options_check'),
'desc' => __('Select the pages to be featured on home page one', 'options_check'),
'id' => 'featured_page_one',
'type' => 'select',
'options' => $options_pages);
Featured Content Display
[ get_post() : home.php]
 <?php
 $pageID = of_get_option('featured_page_one');
 $pageObj = get_post($pageID);
 $pageContent = $pageObj->post_content;
 ?>
 <h3><?php echo $pageObj->post_title; ?></h3>
 </div>
 <p>
 <?php echo substr(strip_tags($pageContent),0,500)."...."; ?>
 <br />
 <a href="<?php echo get_permalink($pageID); ?>">more info</a>
 </p>
Content Type
 Post
- blog, news style content.
- single.php
 Page
- static content like contact us, about us page.
- page.php
single.phpblog_single.html
 Create single.php file.
 Copy all code from blog_single.html to single.php
Post : Single.php
[ blog, news post ]
sidebar.php
header.php - get_header();
footer.php - get_footer();
Post : Single.php
[Demo Post ]
 https://developers.facebook.com/docs/reference/plugins/comments/
Post : single.php
[ The Loop ]
<?php get_header(); ?>
<?php if (have_posts()) :
while(have_posts()) : the_post(); ?>
Title: <?php the_title(); ?>
Published date: <?php the_date('F j, Y'); ?>
Author: <?php the_author_posts_link() ?>
Category: <?php the_category(', '); ?>
Tag: <?php the_tags(','); ?>
Content: <?php the_content(); ?>
<?php endwhile; endif; ?>
<?php get_sidebar(); ?>
<?php get_footer(); ?>
Page : page.php
[ Demo ]
Page : page.php
[ The Loop ]
<?php get_header(); ?>
<?php if (have_posts()) :
while(have_posts()) : the_post(); ?>
Title: <?php the_title(); ?>
Content: <?php the_content(); ?>
<?php endwhile; endif; ?>
<?php get_sidebar(); ?>
<?php get_footer(); ?>
No Published date:
No Author:
No Category:
No Tag:
No Comment
Custom Page : mycontact.php
<?php
/*
Template Name: My Contact Page
*/
?>
index.phpsingle.php
 Copy all code from single.php to index.php
 Just remove the_content( ) with the_excerpt( )
 And add read more link using the_permalink( );
Index.php
[ default template ]
Sidebars :
Dynamic Widget Ready
[Demo : page, post]
<div class="widget">
<h2><span>Categories</span></h2>
<!– Content Goes here -->
</div>
Sidebars : Dynamic Widget Ready
[ Registering : functions.php]
register_sidebar(
array(
'name' => 'Sidebar',
'id' => 'right-sidebar',
'before_widget' => '<div class="widget">',
'after_widget' => '</div>',
'before_title' => '<h2><span>',
'after_title' => '</span></h2>',
)
);
Sidebars : Dynamic Widget Ready
[ Displaying : sidebar.php]
<div class="sidebar">
<?php
if ( !function_exists('dynamic_sidebar') ||
!dynamic_sidebar('right-sidebar') ) :
endif;
?>
</div>
Extra : Plugin
[ Next Gen Gallery ]
 http://wordpress.org/plugins/nextgen-gallery/
Extra : Plugin
[ Contact Form 7 ]
 http://wordpress.org/plugins/contact-form-7/
Extra : Plugin
[ WP-PageNavi ]
http://wordpress.org/plugins/wp-pagenavi/
Reference
[ For more ]
 http://codex.wordpress.org
 http://www.youtube.com/watch?v=uwecNcdAUaY
 http://line25.com/tutorials/how-to-create-a-simple-wordpress-blog-theme
 http://blog.teamtreehouse.com/responsive-wordpress-bootstrap-theme-tutorial
 http://www.onextrapixel.com/2011/03/08/how-to-code-a-wordpress-3-0-theme-
from-scratch/
 Google.com 
Thank You!
QUESTIONS?
Chandra Prakash Thapa
@cpthapa
cpthapa@gmail.com
cpthapa.com.np
MeroBox.com

Más contenido relacionado

La actualidad más candente

How to Prepare a WordPress Theme for Public Release
How to Prepare a WordPress Theme for Public ReleaseHow to Prepare a WordPress Theme for Public Release
How to Prepare a WordPress Theme for Public ReleaseDavid Yeiser
 
The Way to Theme Enlightenment
The Way to Theme EnlightenmentThe Way to Theme Enlightenment
The Way to Theme EnlightenmentAmanda Giles
 
Introduction to Custom WordPress Themeing
Introduction to Custom WordPress ThemeingIntroduction to Custom WordPress Themeing
Introduction to Custom WordPress ThemeingJamie Schmid
 
Creating Customizable Widgets for Unpredictable Needs
Creating Customizable Widgets for Unpredictable NeedsCreating Customizable Widgets for Unpredictable Needs
Creating Customizable Widgets for Unpredictable NeedsAmanda Giles
 
Responsive Theme Workshop - WordCamp Columbus 2015
Responsive Theme Workshop - WordCamp Columbus 2015Responsive Theme Workshop - WordCamp Columbus 2015
Responsive Theme Workshop - WordCamp Columbus 2015Joe Querin
 
Shortcodes vs Widgets: Which one and how?
Shortcodes vs Widgets: Which one and how?Shortcodes vs Widgets: Which one and how?
Shortcodes vs Widgets: Which one and how?Amanda Giles
 
Customizing WordPress Themes
Customizing WordPress ThemesCustomizing WordPress Themes
Customizing WordPress ThemesLaura Hartwig
 
Don't Fear the Custom Theme: How to build a custom WordPress theme with only ...
Don't Fear the Custom Theme: How to build a custom WordPress theme with only ...Don't Fear the Custom Theme: How to build a custom WordPress theme with only ...
Don't Fear the Custom Theme: How to build a custom WordPress theme with only ...LinnAlexandra
 
WordPress Child Themes
WordPress Child ThemesWordPress Child Themes
WordPress Child Themesrfair404
 
Theme development essentials columbus oh word camp 2012
Theme development essentials   columbus oh word camp 2012Theme development essentials   columbus oh word camp 2012
Theme development essentials columbus oh word camp 2012Joe Querin
 
WordPress Theme Development
WordPress Theme DevelopmentWordPress Theme Development
WordPress Theme DevelopmentWisdmLabs
 
WordPress Developers Israel Meetup #1
WordPress Developers Israel Meetup #1WordPress Developers Israel Meetup #1
WordPress Developers Israel Meetup #1Yoav Farhi
 
Build a WordPress theme from HTML5 template @ Telerik
Build a WordPress theme from HTML5 template @ TelerikBuild a WordPress theme from HTML5 template @ Telerik
Build a WordPress theme from HTML5 template @ TelerikMario Peshev
 
Childthemes ottawa-word camp-1919
Childthemes ottawa-word camp-1919Childthemes ottawa-word camp-1919
Childthemes ottawa-word camp-1919Paul Bearne
 
Cms & wordpress theme development 2011
Cms & wordpress theme development 2011Cms & wordpress theme development 2011
Cms & wordpress theme development 2011Dave Wallace
 
WordPress Theme Development Basics
WordPress Theme Development BasicsWordPress Theme Development Basics
WordPress Theme Development BasicsTech Liminal
 
Wordpress theme submission requirement for Themeforest
Wordpress theme submission requirement for ThemeforestWordpress theme submission requirement for Themeforest
Wordpress theme submission requirement for ThemeforestEnayet Rajib
 

La actualidad más candente (20)

How to Prepare a WordPress Theme for Public Release
How to Prepare a WordPress Theme for Public ReleaseHow to Prepare a WordPress Theme for Public Release
How to Prepare a WordPress Theme for Public Release
 
The Way to Theme Enlightenment
The Way to Theme EnlightenmentThe Way to Theme Enlightenment
The Way to Theme Enlightenment
 
Introduction to Custom WordPress Themeing
Introduction to Custom WordPress ThemeingIntroduction to Custom WordPress Themeing
Introduction to Custom WordPress Themeing
 
Creating Customizable Widgets for Unpredictable Needs
Creating Customizable Widgets for Unpredictable NeedsCreating Customizable Widgets for Unpredictable Needs
Creating Customizable Widgets for Unpredictable Needs
 
Responsive Theme Workshop - WordCamp Columbus 2015
Responsive Theme Workshop - WordCamp Columbus 2015Responsive Theme Workshop - WordCamp Columbus 2015
Responsive Theme Workshop - WordCamp Columbus 2015
 
Theming 101
Theming 101Theming 101
Theming 101
 
Shortcodes vs Widgets: Which one and how?
Shortcodes vs Widgets: Which one and how?Shortcodes vs Widgets: Which one and how?
Shortcodes vs Widgets: Which one and how?
 
Customizing WordPress Themes
Customizing WordPress ThemesCustomizing WordPress Themes
Customizing WordPress Themes
 
Don't Fear the Custom Theme: How to build a custom WordPress theme with only ...
Don't Fear the Custom Theme: How to build a custom WordPress theme with only ...Don't Fear the Custom Theme: How to build a custom WordPress theme with only ...
Don't Fear the Custom Theme: How to build a custom WordPress theme with only ...
 
WordPress Child Themes
WordPress Child ThemesWordPress Child Themes
WordPress Child Themes
 
Demystifying WordPress Conditional Tags
Demystifying WordPress Conditional TagsDemystifying WordPress Conditional Tags
Demystifying WordPress Conditional Tags
 
Theme development essentials columbus oh word camp 2012
Theme development essentials   columbus oh word camp 2012Theme development essentials   columbus oh word camp 2012
Theme development essentials columbus oh word camp 2012
 
WordPress Theme Development
WordPress Theme DevelopmentWordPress Theme Development
WordPress Theme Development
 
WordPress Developers Israel Meetup #1
WordPress Developers Israel Meetup #1WordPress Developers Israel Meetup #1
WordPress Developers Israel Meetup #1
 
Seven deadly theming sins
Seven deadly theming sinsSeven deadly theming sins
Seven deadly theming sins
 
Build a WordPress theme from HTML5 template @ Telerik
Build a WordPress theme from HTML5 template @ TelerikBuild a WordPress theme from HTML5 template @ Telerik
Build a WordPress theme from HTML5 template @ Telerik
 
Childthemes ottawa-word camp-1919
Childthemes ottawa-word camp-1919Childthemes ottawa-word camp-1919
Childthemes ottawa-word camp-1919
 
Cms & wordpress theme development 2011
Cms & wordpress theme development 2011Cms & wordpress theme development 2011
Cms & wordpress theme development 2011
 
WordPress Theme Development Basics
WordPress Theme Development BasicsWordPress Theme Development Basics
WordPress Theme Development Basics
 
Wordpress theme submission requirement for Themeforest
Wordpress theme submission requirement for ThemeforestWordpress theme submission requirement for Themeforest
Wordpress theme submission requirement for Themeforest
 

Destacado

WordCamp TOR: Beyond The Guidelines - Theme Development Best Practices (Vol 1)
WordCamp TOR: Beyond The Guidelines - Theme Development Best Practices (Vol 1)WordCamp TOR: Beyond The Guidelines - Theme Development Best Practices (Vol 1)
WordCamp TOR: Beyond The Guidelines - Theme Development Best Practices (Vol 1)Chip Bennett
 
Theme Development: From an idea to getting approved to wordpress.org
Theme Development: From an idea to getting approved to wordpress.orgTheme Development: From an idea to getting approved to wordpress.org
Theme Development: From an idea to getting approved to wordpress.orgThemeHorse
 
Content Management Systems (CMS) & Wordpress theme development
Content Management Systems (CMS) & Wordpress theme developmentContent Management Systems (CMS) & Wordpress theme development
Content Management Systems (CMS) & Wordpress theme developmentDave Wallace
 
Geekend 2012 - Jumping Into Tumblr Theme Development
Geekend 2012 - Jumping Into Tumblr Theme DevelopmentGeekend 2012 - Jumping Into Tumblr Theme Development
Geekend 2012 - Jumping Into Tumblr Theme DevelopmentStoryware
 
DrupalEasy: Intro to Theme Development
DrupalEasy: Intro to Theme DevelopmentDrupalEasy: Intro to Theme Development
DrupalEasy: Intro to Theme Developmentultimike
 
Rapid WordPress Theme Development
Rapid WordPress Theme DevelopmentRapid WordPress Theme Development
Rapid WordPress Theme DevelopmentJosh Williams
 
Better WordPress Theme Development Workflow
Better WordPress Theme Development WorkflowBetter WordPress Theme Development Workflow
Better WordPress Theme Development WorkflowRajeeb Banstola
 
Drupal Best Practices
Drupal Best PracticesDrupal Best Practices
Drupal Best Practicesmanugoel2003
 
Approaches To WordPress Theme Development
Approaches To WordPress Theme DevelopmentApproaches To WordPress Theme Development
Approaches To WordPress Theme DevelopmentCatch Themes
 
Drupal Theme Development - DrupalCon Chicago 2011
Drupal Theme Development - DrupalCon Chicago 2011Drupal Theme Development - DrupalCon Chicago 2011
Drupal Theme Development - DrupalCon Chicago 2011Ryan Price
 
MSP Development Theme
MSP Development ThemeMSP Development Theme
MSP Development ThemeTOPdesk
 

Destacado (14)

WordCamp TOR: Beyond The Guidelines - Theme Development Best Practices (Vol 1)
WordCamp TOR: Beyond The Guidelines - Theme Development Best Practices (Vol 1)WordCamp TOR: Beyond The Guidelines - Theme Development Best Practices (Vol 1)
WordCamp TOR: Beyond The Guidelines - Theme Development Best Practices (Vol 1)
 
Theme Development: From an idea to getting approved to wordpress.org
Theme Development: From an idea to getting approved to wordpress.orgTheme Development: From an idea to getting approved to wordpress.org
Theme Development: From an idea to getting approved to wordpress.org
 
Content Management Systems (CMS) & Wordpress theme development
Content Management Systems (CMS) & Wordpress theme developmentContent Management Systems (CMS) & Wordpress theme development
Content Management Systems (CMS) & Wordpress theme development
 
Theme development mac
Theme development macTheme development mac
Theme development mac
 
Geekend 2012 - Jumping Into Tumblr Theme Development
Geekend 2012 - Jumping Into Tumblr Theme DevelopmentGeekend 2012 - Jumping Into Tumblr Theme Development
Geekend 2012 - Jumping Into Tumblr Theme Development
 
DrupalEasy: Intro to Theme Development
DrupalEasy: Intro to Theme DevelopmentDrupalEasy: Intro to Theme Development
DrupalEasy: Intro to Theme Development
 
Rapid WordPress Theme Development
Rapid WordPress Theme DevelopmentRapid WordPress Theme Development
Rapid WordPress Theme Development
 
Theme Development
Theme DevelopmentTheme Development
Theme Development
 
Better WordPress Theme Development Workflow
Better WordPress Theme Development WorkflowBetter WordPress Theme Development Workflow
Better WordPress Theme Development Workflow
 
Drupal Best Practices
Drupal Best PracticesDrupal Best Practices
Drupal Best Practices
 
Approaches To WordPress Theme Development
Approaches To WordPress Theme DevelopmentApproaches To WordPress Theme Development
Approaches To WordPress Theme Development
 
Best Practices in Theme Development - WordCamp Orlando 2012
Best Practices in Theme Development - WordCamp Orlando 2012Best Practices in Theme Development - WordCamp Orlando 2012
Best Practices in Theme Development - WordCamp Orlando 2012
 
Drupal Theme Development - DrupalCon Chicago 2011
Drupal Theme Development - DrupalCon Chicago 2011Drupal Theme Development - DrupalCon Chicago 2011
Drupal Theme Development - DrupalCon Chicago 2011
 
MSP Development Theme
MSP Development ThemeMSP Development Theme
MSP Development Theme
 

Similar a WordPress theme development from scratch : ICT MeetUp 2013 Nepal

How to make a WordPress theme
How to make a WordPress themeHow to make a WordPress theme
How to make a WordPress themeHardeep Asrani
 
PSD to WordPress
PSD to WordPressPSD to WordPress
PSD to WordPressNile Flores
 
WordPress Theme Workshop: Part 4
WordPress Theme Workshop: Part 4WordPress Theme Workshop: Part 4
WordPress Theme Workshop: Part 4David Bisset
 
WordPress Theme Design - Rich Media Institute Workshop
WordPress Theme Design - Rich Media Institute WorkshopWordPress Theme Design - Rich Media Institute Workshop
WordPress Theme Design - Rich Media Institute WorkshopBrendan Sera-Shriar
 
Building Potent WordPress Websites
Building Potent WordPress WebsitesBuilding Potent WordPress Websites
Building Potent WordPress WebsitesKyle Cearley
 
Intro to Plugin Development, Miami WordCamp, 2015
Intro to Plugin Development, Miami WordCamp, 2015Intro to Plugin Development, Miami WordCamp, 2015
Intro to Plugin Development, Miami WordCamp, 2015topher1kenobe
 
WordPress Theme Workshop: Part 3
WordPress Theme Workshop: Part 3WordPress Theme Workshop: Part 3
WordPress Theme Workshop: Part 3David Bisset
 
Intro to WordPress Plugin Development
Intro to WordPress Plugin DevelopmentIntro to WordPress Plugin Development
Intro to WordPress Plugin DevelopmentBrad Williams
 
Wordpress Custom Child theme
Wordpress Custom Child themeWordpress Custom Child theme
Wordpress Custom Child themeYouSaf HasSan
 
Getting started with WordPress development
Getting started with WordPress developmentGetting started with WordPress development
Getting started with WordPress developmentSteve Mortiboy
 
Arizona WP - Building a WordPress Theme
Arizona WP - Building a WordPress ThemeArizona WP - Building a WordPress Theme
Arizona WP - Building a WordPress Themecertainstrings
 
Builing a WordPress Theme
Builing a WordPress ThemeBuiling a WordPress Theme
Builing a WordPress Themecertainstrings
 
Overview on WordPress theme file structure and working functionality
Overview on WordPress theme file structure and working functionality Overview on WordPress theme file structure and working functionality
Overview on WordPress theme file structure and working functionality Rakesh Kushwaha
 
Creating Your First WordPress Plugin
Creating Your First WordPress PluginCreating Your First WordPress Plugin
Creating Your First WordPress PluginBrad Williams
 
The Way to Theme Enlightenment 2017
The Way to Theme Enlightenment 2017The Way to Theme Enlightenment 2017
The Way to Theme Enlightenment 2017Amanda Giles
 
Step by step guide for creating wordpress plugin
Step by step guide for creating wordpress pluginStep by step guide for creating wordpress plugin
Step by step guide for creating wordpress pluginMainak Goswami
 
WordPress Theme Workshop: Theme Setup
WordPress Theme Workshop: Theme SetupWordPress Theme Workshop: Theme Setup
WordPress Theme Workshop: Theme SetupDavid Bisset
 
Easy Guide to WordPress Theme Integration
Easy Guide to WordPress Theme IntegrationEasy Guide to WordPress Theme Integration
Easy Guide to WordPress Theme IntegrationSankhala Info Solutions
 

Similar a WordPress theme development from scratch : ICT MeetUp 2013 Nepal (20)

How to make a WordPress theme
How to make a WordPress themeHow to make a WordPress theme
How to make a WordPress theme
 
PSD to WordPress
PSD to WordPressPSD to WordPress
PSD to WordPress
 
WordPress Theme Workshop: Part 4
WordPress Theme Workshop: Part 4WordPress Theme Workshop: Part 4
WordPress Theme Workshop: Part 4
 
WordPress Theme Design - Rich Media Institute Workshop
WordPress Theme Design - Rich Media Institute WorkshopWordPress Theme Design - Rich Media Institute Workshop
WordPress Theme Design - Rich Media Institute Workshop
 
20110820 header new style
20110820 header new style20110820 header new style
20110820 header new style
 
Building Potent WordPress Websites
Building Potent WordPress WebsitesBuilding Potent WordPress Websites
Building Potent WordPress Websites
 
Intro to Plugin Development, Miami WordCamp, 2015
Intro to Plugin Development, Miami WordCamp, 2015Intro to Plugin Development, Miami WordCamp, 2015
Intro to Plugin Development, Miami WordCamp, 2015
 
WordPress Theme Workshop: Part 3
WordPress Theme Workshop: Part 3WordPress Theme Workshop: Part 3
WordPress Theme Workshop: Part 3
 
Intro to WordPress Plugin Development
Intro to WordPress Plugin DevelopmentIntro to WordPress Plugin Development
Intro to WordPress Plugin Development
 
Wordpress Custom Child theme
Wordpress Custom Child themeWordpress Custom Child theme
Wordpress Custom Child theme
 
Getting started with WordPress development
Getting started with WordPress developmentGetting started with WordPress development
Getting started with WordPress development
 
Arizona WP - Building a WordPress Theme
Arizona WP - Building a WordPress ThemeArizona WP - Building a WordPress Theme
Arizona WP - Building a WordPress Theme
 
Builing a WordPress Theme
Builing a WordPress ThemeBuiling a WordPress Theme
Builing a WordPress Theme
 
Overview on WordPress theme file structure and working functionality
Overview on WordPress theme file structure and working functionality Overview on WordPress theme file structure and working functionality
Overview on WordPress theme file structure and working functionality
 
Creating Your First WordPress Plugin
Creating Your First WordPress PluginCreating Your First WordPress Plugin
Creating Your First WordPress Plugin
 
The Way to Theme Enlightenment 2017
The Way to Theme Enlightenment 2017The Way to Theme Enlightenment 2017
The Way to Theme Enlightenment 2017
 
Word Camp Fukuoka2010
Word Camp Fukuoka2010Word Camp Fukuoka2010
Word Camp Fukuoka2010
 
Step by step guide for creating wordpress plugin
Step by step guide for creating wordpress pluginStep by step guide for creating wordpress plugin
Step by step guide for creating wordpress plugin
 
WordPress Theme Workshop: Theme Setup
WordPress Theme Workshop: Theme SetupWordPress Theme Workshop: Theme Setup
WordPress Theme Workshop: Theme Setup
 
Easy Guide to WordPress Theme Integration
Easy Guide to WordPress Theme IntegrationEasy Guide to WordPress Theme Integration
Easy Guide to WordPress Theme Integration
 

Último

UiPath Clipboard AI: "A TIME Magazine Best Invention of 2023 Unveiled"
UiPath Clipboard AI: "A TIME Magazine Best Invention of 2023 Unveiled"UiPath Clipboard AI: "A TIME Magazine Best Invention of 2023 Unveiled"
UiPath Clipboard AI: "A TIME Magazine Best Invention of 2023 Unveiled"DianaGray10
 
20230202 - Introduction to tis-py
20230202 - Introduction to tis-py20230202 - Introduction to tis-py
20230202 - Introduction to tis-pyJamie (Taka) Wang
 
Governance in SharePoint Premium:What's in the box?
Governance in SharePoint Premium:What's in the box?Governance in SharePoint Premium:What's in the box?
Governance in SharePoint Premium:What's in the box?Juan Carlos Gonzalez
 
9 Steps For Building Winning Founding Team
9 Steps For Building Winning Founding Team9 Steps For Building Winning Founding Team
9 Steps For Building Winning Founding TeamAdam Moalla
 
COMPUTER 10 Lesson 8 - Building a Website
COMPUTER 10 Lesson 8 - Building a WebsiteCOMPUTER 10 Lesson 8 - Building a Website
COMPUTER 10 Lesson 8 - Building a Websitedgelyza
 
OpenShift Commons Paris - Choose Your Own Observability Adventure
OpenShift Commons Paris - Choose Your Own Observability AdventureOpenShift Commons Paris - Choose Your Own Observability Adventure
OpenShift Commons Paris - Choose Your Own Observability AdventureEric D. Schabell
 
Machine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdfMachine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdfAijun Zhang
 
99.99% of Your Traces Are (Probably) Trash (SRECon NA 2024).pdf
99.99% of Your Traces  Are (Probably) Trash (SRECon NA 2024).pdf99.99% of Your Traces  Are (Probably) Trash (SRECon NA 2024).pdf
99.99% of Your Traces Are (Probably) Trash (SRECon NA 2024).pdfPaige Cruz
 
Building Your Own AI Instance (TBLC AI )
Building Your Own AI Instance (TBLC AI )Building Your Own AI Instance (TBLC AI )
Building Your Own AI Instance (TBLC AI )Brian Pichman
 
The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...
The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...
The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...Aggregage
 
How Accurate are Carbon Emissions Projections?
How Accurate are Carbon Emissions Projections?How Accurate are Carbon Emissions Projections?
How Accurate are Carbon Emissions Projections?IES VE
 
All in AI: LLM Landscape & RAG in 2024 with Mark Ryan (Google) & Jerry Liu (L...
All in AI: LLM Landscape & RAG in 2024 with Mark Ryan (Google) & Jerry Liu (L...All in AI: LLM Landscape & RAG in 2024 with Mark Ryan (Google) & Jerry Liu (L...
All in AI: LLM Landscape & RAG in 2024 with Mark Ryan (Google) & Jerry Liu (L...Daniel Zivkovic
 
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdfUiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdfDianaGray10
 
The Kubernetes Gateway API and its role in Cloud Native API Management
The Kubernetes Gateway API and its role in Cloud Native API ManagementThe Kubernetes Gateway API and its role in Cloud Native API Management
The Kubernetes Gateway API and its role in Cloud Native API ManagementNuwan Dias
 
Nanopower In Semiconductor Industry.pdf
Nanopower  In Semiconductor Industry.pdfNanopower  In Semiconductor Industry.pdf
Nanopower In Semiconductor Industry.pdfPedro Manuel
 
activity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdf
activity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdf
activity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdfJamie (Taka) Wang
 
Empowering Africa's Next Generation: The AI Leadership Blueprint
Empowering Africa's Next Generation: The AI Leadership BlueprintEmpowering Africa's Next Generation: The AI Leadership Blueprint
Empowering Africa's Next Generation: The AI Leadership BlueprintMahmoud Rabie
 
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...UbiTrack UK
 
Meet the new FSP 3000 M-Flex800™
Meet the new FSP 3000 M-Flex800™Meet the new FSP 3000 M-Flex800™
Meet the new FSP 3000 M-Flex800™Adtran
 
Salesforce Miami User Group Event - 1st Quarter 2024
Salesforce Miami User Group Event - 1st Quarter 2024Salesforce Miami User Group Event - 1st Quarter 2024
Salesforce Miami User Group Event - 1st Quarter 2024SkyPlanner
 

Último (20)

UiPath Clipboard AI: "A TIME Magazine Best Invention of 2023 Unveiled"
UiPath Clipboard AI: "A TIME Magazine Best Invention of 2023 Unveiled"UiPath Clipboard AI: "A TIME Magazine Best Invention of 2023 Unveiled"
UiPath Clipboard AI: "A TIME Magazine Best Invention of 2023 Unveiled"
 
20230202 - Introduction to tis-py
20230202 - Introduction to tis-py20230202 - Introduction to tis-py
20230202 - Introduction to tis-py
 
Governance in SharePoint Premium:What's in the box?
Governance in SharePoint Premium:What's in the box?Governance in SharePoint Premium:What's in the box?
Governance in SharePoint Premium:What's in the box?
 
9 Steps For Building Winning Founding Team
9 Steps For Building Winning Founding Team9 Steps For Building Winning Founding Team
9 Steps For Building Winning Founding Team
 
COMPUTER 10 Lesson 8 - Building a Website
COMPUTER 10 Lesson 8 - Building a WebsiteCOMPUTER 10 Lesson 8 - Building a Website
COMPUTER 10 Lesson 8 - Building a Website
 
OpenShift Commons Paris - Choose Your Own Observability Adventure
OpenShift Commons Paris - Choose Your Own Observability AdventureOpenShift Commons Paris - Choose Your Own Observability Adventure
OpenShift Commons Paris - Choose Your Own Observability Adventure
 
Machine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdfMachine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdf
 
99.99% of Your Traces Are (Probably) Trash (SRECon NA 2024).pdf
99.99% of Your Traces  Are (Probably) Trash (SRECon NA 2024).pdf99.99% of Your Traces  Are (Probably) Trash (SRECon NA 2024).pdf
99.99% of Your Traces Are (Probably) Trash (SRECon NA 2024).pdf
 
Building Your Own AI Instance (TBLC AI )
Building Your Own AI Instance (TBLC AI )Building Your Own AI Instance (TBLC AI )
Building Your Own AI Instance (TBLC AI )
 
The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...
The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...
The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...
 
How Accurate are Carbon Emissions Projections?
How Accurate are Carbon Emissions Projections?How Accurate are Carbon Emissions Projections?
How Accurate are Carbon Emissions Projections?
 
All in AI: LLM Landscape & RAG in 2024 with Mark Ryan (Google) & Jerry Liu (L...
All in AI: LLM Landscape & RAG in 2024 with Mark Ryan (Google) & Jerry Liu (L...All in AI: LLM Landscape & RAG in 2024 with Mark Ryan (Google) & Jerry Liu (L...
All in AI: LLM Landscape & RAG in 2024 with Mark Ryan (Google) & Jerry Liu (L...
 
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdfUiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
 
The Kubernetes Gateway API and its role in Cloud Native API Management
The Kubernetes Gateway API and its role in Cloud Native API ManagementThe Kubernetes Gateway API and its role in Cloud Native API Management
The Kubernetes Gateway API and its role in Cloud Native API Management
 
Nanopower In Semiconductor Industry.pdf
Nanopower  In Semiconductor Industry.pdfNanopower  In Semiconductor Industry.pdf
Nanopower In Semiconductor Industry.pdf
 
activity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdf
activity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdf
activity_diagram_combine_v4_20190827.pdfactivity_diagram_combine_v4_20190827.pdf
 
Empowering Africa's Next Generation: The AI Leadership Blueprint
Empowering Africa's Next Generation: The AI Leadership BlueprintEmpowering Africa's Next Generation: The AI Leadership Blueprint
Empowering Africa's Next Generation: The AI Leadership Blueprint
 
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...
 
Meet the new FSP 3000 M-Flex800™
Meet the new FSP 3000 M-Flex800™Meet the new FSP 3000 M-Flex800™
Meet the new FSP 3000 M-Flex800™
 
Salesforce Miami User Group Event - 1st Quarter 2024
Salesforce Miami User Group Event - 1st Quarter 2024Salesforce Miami User Group Event - 1st Quarter 2024
Salesforce Miami User Group Event - 1st Quarter 2024
 

WordPress theme development from scratch : ICT MeetUp 2013 Nepal

  • 1. WORDPRESS THEME Development From Scratch ICT MeetUp 2013 By : Chandra Prakash Thapa
  • 2. What is a WordPress theme? A group of templates and a stylesheet that displays content entered into the database via the WordPress admin. At a minimum, you need:  index.php  style.css
  • 3. Let’s Start [ Get Free Responsive Template ]  Download the brownie template from: http://www.html5xcss3.com/2012/06/html5-template- responsive-brownie.html  Copy and paste the HTML design file to WordPress theme directory. [ wp-content/themes/brownie ]  Rename the index.html to index.php  Create a style.css file in brownie. [ wp-content/themes/brownie/style.css ]
  • 4. style.css [ Template Settings ] /* Theme Name: Brownie. Theme URI: http://merobox.com/ Description: This is my first WordPress template. Author: Chandra Prakash Thapa. Author URI: http://cpthapa.com.np/ Version: 1.0 Tags: brown, two-columns, custom-background, License: License URI: General comments (optional). */
  • 6. Add screenshot image inside theme folder [ wp-content/themes/brownie/screenshot.png ]
  • 8. Static Link 1. CSS : <link rel="stylesheet" href=“css/style.css" type="text/css" /> 2. Script : <script type="text/javascript" src=“js/jquery.min.js"></script> 3. Images : <img src=“images/facebook.png" alt="Facebook"> 1. CSS : <link rel="stylesheet" href="<?php bloginfo('template_url'); ?>/css/style.css" type="text/css" /> 2. Script : <script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/jquery.min.js"></script> 3. Images : <img src="<?php bloginfo('template_url'); ?>/images/facebook.png" alt="Facebook"> To Dynamic Link
  • 10. A Basic Theme Requirement  404.php - Custom “not found” page  footer.php - The template called with get_footer()  functions.php - A place to create custom functions, register sidebars, and other settings  header.php - The template called with get_header()  index.php - The default template  home.php - The basic home template  page.php - Overall template for pages  search.php - Search results template  searchform.php - The template called with get_search_form()  sidebar.php - The template called with get_sidebar()  single.php - Overall template for single posts  style.css - The main stylesheet
  • 11. home.phpindex.php  Create home.php file.  Copy all code from index.php to home.php
  • 12. Break Code Into segments [home.php]
  • 13. Header.php // Add wp_head() function before end of </head> tag. <?php wp_head (); ?> </head> <body> <header class="header_bg clearfix">
  • 14. Header.php // Add title to your website <title> <?php bloginfo('name'); // Title of the website ?> <?php wp_title(); // Title of the single page or post ?> </title>
  • 15. Footer.php // Add wp_footer() function before end of </body> tag. <?php wp_footer(); ?> </body> </html>
  • 16. Footer Copyright. [ footer.php ]  <p>  &copy;  <?php echo date('Y'); ?>  <?php bloginfo('name'); ?>.  </p>
  • 17. Home.php  <?php get_header(); ?>  Remaining code part.(after excluding header / footer)  <?php get_footer(); ?>
  • 18. functions.php  File is place inside theme folder. wp-content/themes/yourtheme/functions.php  Changes default behavior of WordPress.  Behaves like WordPress Plugin.  Use it to call PHP or built-in WordPress functions.  Use to define your own functions.  Register menu, sidebar and widgets.
  • 19. Registering Menu // registering header and footer menu in functions.php file function merobox_addmenus() { register_nav_menus( array( 'header_nav' => 'Header Menu', 'footer_nav' => 'Footer Menu' ) ); } add_action('init', 'merobox_addmenus');
  • 20. A look into menu (3.6 version)
  • 21. Displaying menu (footer menu) <div class="menu"> <?php if (has_nav_menu('footer_nav')) { wp_nav_menu( array('theme_location' => 'footer_nav') ); } ?> </div>
  • 22. Displaying menu [ header menu ] <?php if (has_nav_menu('header_nav')) { wp_nav_menu( array( 'theme_location' => 'header_nav', 'container' => 'nav', 'container_class' => 'main-menu' ) ); } ?>
  • 23. Theme options  Option Framework add theme options panel.  http://wordpress.org/plugins/options-framework/  Download -> Install -> Activate.
  • 24. Add Options.php  Download optons.php file from link below :  https://github.com/devinsays/options-framework- plugin/blob/master/options-check/options.php  Add options.php file in the theme folder brownie.
  • 26. Dynamic text [ option.php ]  $options[] = array(  'name' => __('Why Line one', 'options_check'),  'desc' => __(' Why to choose your business line one.', 'options_check'),  'id' => 'why_line_one',  'std' => 'Default Text',  'type' => 'text‘  );
  • 27. Dynamic text display [ home.php]  Add the following code to display previously added content. <p> <?php echo of_get_option('why_line_one'); ?> </p>
  • 28. Dynamic Image Slider [home.php]  The Query  The Loop  Reset Query
  • 29. Dynamic Image Slider [ Post Thumbnail Support] // Add post thumbnails support in functions.php file add_theme_support( 'post-thumbnails' ); // default thumbnail size for photo gallery set_post_thumbnail_size( 281, 140, true ); //thumbnail size for image slider add_image_size( 'image_slide_thumb', 940, 360, true );
  • 30. Dynamic Image Slider <ul class="slides"> <?php $slider_cat = of_get_option('image_slider'); // The Query query_posts( 'posts_per_page=5&cat='.$slider_cat ); // The Loop while ( have_posts() ) : the_post(); ?> <li> <?php the_post_thumbnail('image_slide_thumb',true); ?> <p class="flex-caption"><?php the_title(); ?></p> </li> <?php endwhile; // Reset Query wp_reset_query(); ?> </ul>
  • 31. Dynamic Image Slider [ The Query ] <ul class="slides"> <?php // The Query $slider_cat = of_get_option('image_slider'); query_posts( 'posts_per_page=5&cat='.$slider_cat ); [ The Option Panel ] $options[] = array( 'name' => __('Image Slider', 'options_check'), 'desc' => __('Catgory to use for image slider', 'options_check'), 'id' => 'image_slider', 'type' => 'select', 'options' => $options_categories);
  • 32. Dynamic Image Slider [ The Loop ] // The Loop while ( have_posts() ) : the_post(); ?> <li> <?php the_post_thumbnail('image_slide_thumb',true); ?> <p class="flex-caption"><?php the_title(); ?></p> </li> <?php endwhile;
  • 33. Dynamic Image Slider [ Reset Query ] // Reset Query wp_reset_query(); ?> </ul>
  • 35. Featured Content Settings [ The Option Panel : options.php] $options[] = array( 'name' => __('Featured Page one', 'options_check'), 'desc' => __('Select the pages to be featured on home page one', 'options_check'), 'id' => 'featured_page_one', 'type' => 'select', 'options' => $options_pages);
  • 36. Featured Content Display [ get_post() : home.php]  <?php  $pageID = of_get_option('featured_page_one');  $pageObj = get_post($pageID);  $pageContent = $pageObj->post_content;  ?>  <h3><?php echo $pageObj->post_title; ?></h3>  </div>  <p>  <?php echo substr(strip_tags($pageContent),0,500)."...."; ?>  <br />  <a href="<?php echo get_permalink($pageID); ?>">more info</a>  </p>
  • 37. Content Type  Post - blog, news style content. - single.php  Page - static content like contact us, about us page. - page.php
  • 38. single.phpblog_single.html  Create single.php file.  Copy all code from blog_single.html to single.php
  • 39. Post : Single.php [ blog, news post ]
  • 41. Post : Single.php [Demo Post ]  https://developers.facebook.com/docs/reference/plugins/comments/
  • 42. Post : single.php [ The Loop ] <?php get_header(); ?> <?php if (have_posts()) : while(have_posts()) : the_post(); ?> Title: <?php the_title(); ?> Published date: <?php the_date('F j, Y'); ?> Author: <?php the_author_posts_link() ?> Category: <?php the_category(', '); ?> Tag: <?php the_tags(','); ?> Content: <?php the_content(); ?> <?php endwhile; endif; ?> <?php get_sidebar(); ?> <?php get_footer(); ?>
  • 44. Page : page.php [ The Loop ] <?php get_header(); ?> <?php if (have_posts()) : while(have_posts()) : the_post(); ?> Title: <?php the_title(); ?> Content: <?php the_content(); ?> <?php endwhile; endif; ?> <?php get_sidebar(); ?> <?php get_footer(); ?> No Published date: No Author: No Category: No Tag: No Comment
  • 45. Custom Page : mycontact.php <?php /* Template Name: My Contact Page */ ?>
  • 46. index.phpsingle.php  Copy all code from single.php to index.php  Just remove the_content( ) with the_excerpt( )  And add read more link using the_permalink( ); Index.php [ default template ]
  • 47. Sidebars : Dynamic Widget Ready [Demo : page, post] <div class="widget"> <h2><span>Categories</span></h2> <!– Content Goes here --> </div>
  • 48. Sidebars : Dynamic Widget Ready [ Registering : functions.php] register_sidebar( array( 'name' => 'Sidebar', 'id' => 'right-sidebar', 'before_widget' => '<div class="widget">', 'after_widget' => '</div>', 'before_title' => '<h2><span>', 'after_title' => '</span></h2>', ) );
  • 49. Sidebars : Dynamic Widget Ready [ Displaying : sidebar.php] <div class="sidebar"> <?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('right-sidebar') ) : endif; ?> </div>
  • 50. Extra : Plugin [ Next Gen Gallery ]  http://wordpress.org/plugins/nextgen-gallery/
  • 51. Extra : Plugin [ Contact Form 7 ]  http://wordpress.org/plugins/contact-form-7/
  • 52. Extra : Plugin [ WP-PageNavi ] http://wordpress.org/plugins/wp-pagenavi/
  • 53. Reference [ For more ]  http://codex.wordpress.org  http://www.youtube.com/watch?v=uwecNcdAUaY  http://line25.com/tutorials/how-to-create-a-simple-wordpress-blog-theme  http://blog.teamtreehouse.com/responsive-wordpress-bootstrap-theme-tutorial  http://www.onextrapixel.com/2011/03/08/how-to-code-a-wordpress-3-0-theme- from-scratch/  Google.com 
  • 54. Thank You! QUESTIONS? Chandra Prakash Thapa @cpthapa cpthapa@gmail.com cpthapa.com.np MeroBox.com