SlideShare uma empresa Scribd logo
1 de 17
Baixar para ler offline
WordPress
Introduction to create your own theme




                                        CC:BY-NC
Info.
Name: Sitdhibong Laokok
Contact: sitdhibong@gmail.com
Class Name: WordPress Theme Dev.
Office Hours: 24/7 (for e-mail)
Checklist
✓ Download WordPress 3.x+

  http:/ /www.wordpress.org/
  http://www.wordpress.org/download


✓ Web server (Public or localhost)

✓ PHP 5.2+

✓ Database (MySQL might be good)

✓ Make it works
  http://codex.wordpress.org/Installing_WordPress
Serf the Web
               http://we.in.th
Web Site



                          WordPress Plugin


                      W
    http://we.in.th




                          WordPress Theme
Example for page structures



                             header



 There is
loop inside
this block
                      content               sidebar
for display
blog entry


           ?
  Lo o p


                             footer

               Note: I can rearrange page structure
                     whatever I want.
WordPress theme in the real world

     er
head




                                    si
                                         d
                                             eb
         t                                     ar
       en
     nt
co
Example for Template




         *A lot more at http://wordpress.org/extend/themes
Theme
Hierarchy:
The
template
files are
called to
generate a
WordPress
page
Minimum file for theme


     • style.css: required for inform theme
         information
     •   header.php: theme header
     •   index.php: main template
     •   single.php: single post display
     •   page.php: template for static home page
     •   footer.php: theme footer
     •   functions.php: functions file
style.css
 /*
     Theme Name: Abracadabra
     Theme URI: http://we.in.th/theme/abracadabra
                                                                 Theme
     Description: Just kidding the theme does not exists
     Author: Apps Tree                                            Info
     Author URI: http://we.in.th/
     Version: 0.1.0
     Tags: black, white, two-columns


     License: GPL 2.0
     License URI: license.txt
 */


 body {
                                         http://codex.wordpress.org/File_Header
      padding: 0;
      margin: 0;
 }
 .
 .
 .
Twenty Eleven theme
  screenshot.png                  WordPress
use for theme thumbnail
                          Version

                             Author

  Theme Name




                                Description




              Tags
What is the Loop ?

         The Loop is used by WordPress to
            display each of your posts.


      Enter
     the Loop                          Yep

                 Query
                for blog      Have            Display
                 posts       posts ?           post

                           No more
                             post

                                       Exit
Here’s the Loop
01: <?php
02: / index.php
     /
03: get_header(); / get content from ‘header.php’ ?>
                   /
04:
                                                              Loop start here (07-15)
05: <div id=”sl-content-wrap”>
06: <?php if ( have_posts() ) : ?>
07:   <?php while( have_posts() ) : the_post(); ?>
08:     <div id=”post-<?php the_ID(); ?>” <?php post_class(); ?>
09:          <a href=”<?php the_permalink(); ?>” title=”<?php the_title(); ?>”>
10:            <h1><?php the_title(); ?></h1>
11:          </a>
12:          <p><?php the_content(); ?></p>
13:          <p><?php the_tags(‘Tag: ‘, ‘,’, ‘.’); ?></p>   have_posts, the_post,
14:     </div>                                              the_ID, post_class,
15:   <?php endwhile; ?>                                    the_permalink, the_title,
16: <?php endif; ?>                                         the_content, the_tags are
17: </div>                                                  not PHP’s func.
18:
19: <?php get_sidebar(); / display content from ‘sidebar.php’ ?>
                          /
20:
21: <?php get_footer(); / display content from ‘footer.php’ ?>
                         /
the things we’ve get from loop

                                                            Loop result
                                                             (04-10)
  01: <!-- Header HTML - above -->
  02: <!-- In this case: there is only one blog entry -->
  03: <div id=”sl-content-wrap”>
  04:   <div id=”post-1” class=”blog-post text ...”>
  05:     <a href=”http://www.we.in.th/lorem-ipsum” title=”Lorem Ipsum”>
  06:          <h1>Lorem Ipsum</h1>
  07:     </a>
  08:     <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed
               diam nonummy nibh euismod tincidunt ut laoreet magna aliquam
               eret volutpat.</p>
  09:     <p>Tag: dummy, WP, Template.</p>
  10:   </div>
  11: </div>
  12:
  13: <!-- Sidebar HTML -->
  14:
  15: <!-- Footer HTML - below -->
What are tags from previous code ?

- It’s called ‘template tags’, here
  the often use template tags

 •   the_content()             •   the_meta()
 •   the_title()               •   the_ID()
 •   the_permalik()            •   the_post_thumbnail()
 •   the_category()            •   the_author()
 •   the_tags()                •   the_shortlink()
 •   the_date()                •   edit_post_link()
 •   the_time()           http://codex.wordpress.org/Template_Tags

 •   the_excerpt()
More Info.
• WordPress Codex

• WordPress Theme and Design
 Presentation - Menn Chris

Mais conteúdo relacionado

Mais procurados

WordPress Theme Development for Designers
WordPress Theme Development for DesignersWordPress Theme Development for Designers
WordPress Theme Development for Designerselliotjaystocks
 
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
 
Introduction to Custom WordPress Themeing
Introduction to Custom WordPress ThemeingIntroduction to Custom WordPress Themeing
Introduction to Custom WordPress ThemeingJamie Schmid
 
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 2.5 Overview - Rich Media Institute
WordPress 2.5 Overview - Rich Media InstituteWordPress 2.5 Overview - Rich Media Institute
WordPress 2.5 Overview - Rich Media InstituteBrendan Sera-Shriar
 
The Way to Theme Enlightenment 2017
The Way to Theme Enlightenment 2017The Way to Theme Enlightenment 2017
The Way to Theme Enlightenment 2017Amanda Giles
 
The Way to Theme Enlightenment
The Way to Theme EnlightenmentThe Way to Theme Enlightenment
The Way to Theme EnlightenmentAmanda Giles
 
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
 
Word press templates
Word press templatesWord press templates
Word press templatesDan Phiffer
 
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
 
WordPress Developers Israel Meetup #1
WordPress Developers Israel Meetup #1WordPress Developers Israel Meetup #1
WordPress Developers Israel Meetup #1Yoav Farhi
 
Installing And Configuration for your Wordpress blog
Installing And Configuration for your Wordpress blogInstalling And Configuration for your Wordpress blog
Installing And Configuration for your Wordpress blogigorgentry
 
WordPress Structure and Best Practices
WordPress Structure and Best PracticesWordPress Structure and Best Practices
WordPress Structure and Best Practicesmarkparolisi
 
WordPress Child Themes
WordPress Child ThemesWordPress Child Themes
WordPress Child Themesrfair404
 
Creating Customizable Widgets for Unpredictable Needs
Creating Customizable Widgets for Unpredictable NeedsCreating Customizable Widgets for Unpredictable Needs
Creating Customizable Widgets for Unpredictable NeedsAmanda Giles
 
Customizing WordPress Themes
Customizing WordPress ThemesCustomizing WordPress Themes
Customizing WordPress ThemesLaura Hartwig
 
WordPress Theme Development Basics
WordPress Theme Development BasicsWordPress Theme Development Basics
WordPress Theme Development BasicsTech Liminal
 

Mais procurados (20)

WordPress Theme Development for Designers
WordPress Theme Development for DesignersWordPress Theme Development for Designers
WordPress Theme Development for Designers
 
Rebrand WordPress Admin
Rebrand WordPress AdminRebrand WordPress Admin
Rebrand WordPress Admin
 
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
 
Theming 101
Theming 101Theming 101
Theming 101
 
Introduction to Custom WordPress Themeing
Introduction to Custom WordPress ThemeingIntroduction to Custom WordPress Themeing
Introduction to Custom WordPress Themeing
 
Wordpress(css,php,js,ajax)
Wordpress(css,php,js,ajax)Wordpress(css,php,js,ajax)
Wordpress(css,php,js,ajax)
 
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 2.5 Overview - Rich Media Institute
WordPress 2.5 Overview - Rich Media InstituteWordPress 2.5 Overview - Rich Media Institute
WordPress 2.5 Overview - Rich Media Institute
 
The Way to Theme Enlightenment 2017
The Way to Theme Enlightenment 2017The Way to Theme Enlightenment 2017
The Way to Theme Enlightenment 2017
 
The Way to Theme Enlightenment
The Way to Theme EnlightenmentThe Way to Theme Enlightenment
The Way to Theme Enlightenment
 
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
 
Word press templates
Word press templatesWord press templates
Word press templates
 
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?
 
WordPress Developers Israel Meetup #1
WordPress Developers Israel Meetup #1WordPress Developers Israel Meetup #1
WordPress Developers Israel Meetup #1
 
Installing And Configuration for your Wordpress blog
Installing And Configuration for your Wordpress blogInstalling And Configuration for your Wordpress blog
Installing And Configuration for your Wordpress blog
 
WordPress Structure and Best Practices
WordPress Structure and Best PracticesWordPress Structure and Best Practices
WordPress Structure and Best Practices
 
WordPress Child Themes
WordPress Child ThemesWordPress Child Themes
WordPress Child Themes
 
Creating Customizable Widgets for Unpredictable Needs
Creating Customizable Widgets for Unpredictable NeedsCreating Customizable Widgets for Unpredictable Needs
Creating Customizable Widgets for Unpredictable Needs
 
Customizing WordPress Themes
Customizing WordPress ThemesCustomizing WordPress Themes
Customizing WordPress Themes
 
WordPress Theme Development Basics
WordPress Theme Development BasicsWordPress Theme Development Basics
WordPress Theme Development Basics
 

Destaque

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
 
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
 
DrupalEasy: Intro to Theme Development
DrupalEasy: Intro to Theme DevelopmentDrupalEasy: Intro to Theme Development
DrupalEasy: Intro to Theme Developmentultimike
 
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
 
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
 
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
 

Destaque (14)

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
 
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)
 
DrupalEasy: Intro to Theme Development
DrupalEasy: Intro to Theme DevelopmentDrupalEasy: Intro to Theme Development
DrupalEasy: Intro to Theme Development
 
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
 
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
 
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
 

Semelhante a Introduction to WordPress Theme Development

PSD to WordPress
PSD to WordPressPSD to WordPress
PSD to WordPressNile Flores
 
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
 
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 Theme Workshop: Part 3
WordPress Theme Workshop: Part 3WordPress Theme Workshop: Part 3
WordPress Theme Workshop: Part 3David Bisset
 
Getting started with WordPress development
Getting started with WordPress developmentGetting started with WordPress development
Getting started with WordPress developmentSteve Mortiboy
 
Childthemes ottawa-word camp-1919
Childthemes ottawa-word camp-1919Childthemes ottawa-word camp-1919
Childthemes ottawa-word camp-1919Paul Bearne
 
WordPress Custom Fields: Control your content presentation by breaking out of...
WordPress Custom Fields: Control your content presentation by breaking out of...WordPress Custom Fields: Control your content presentation by breaking out of...
WordPress Custom Fields: Control your content presentation by breaking out of...Denise Williams
 
WordPress Theme Workshop: Part 4
WordPress Theme Workshop: Part 4WordPress Theme Workshop: Part 4
WordPress Theme Workshop: Part 4David Bisset
 
How to create a basic template
How to create a basic templateHow to create a basic template
How to create a basic templatevathur
 
Builing a WordPress Theme
Builing a WordPress ThemeBuiling a WordPress Theme
Builing a WordPress Themecertainstrings
 
Various Ways of Using WordPress
Various Ways of Using WordPressVarious Ways of Using WordPress
Various Ways of Using WordPressNick La
 
Arizona WP - Building a WordPress Theme
Arizona WP - Building a WordPress ThemeArizona WP - Building a WordPress Theme
Arizona WP - Building a WordPress Themecertainstrings
 
WordPress
WordPressWordPress
WordPressrisager
 
How does get template part works in twenty ten theme
How does get template part works in twenty ten themeHow does get template part works in twenty ten theme
How does get template part works in twenty ten thememohd rozani abd ghani
 
Now That's What I Call WordPress Security 2010
Now That's What I Call WordPress Security 2010Now That's What I Call WordPress Security 2010
Now That's What I Call WordPress Security 2010Brad Williams
 
Anatomy of a Wordpress theme
Anatomy of a Wordpress themeAnatomy of a Wordpress theme
Anatomy of a Wordpress themeDave Wallace
 

Semelhante a Introduction to WordPress Theme Development (20)

PSD to WordPress
PSD to WordPressPSD to WordPress
PSD to WordPress
 
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
 
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 Theme Workshop: Part 3
WordPress Theme Workshop: Part 3WordPress Theme Workshop: Part 3
WordPress Theme Workshop: Part 3
 
WordPress Theming 101
WordPress Theming 101WordPress Theming 101
WordPress Theming 101
 
Getting started with WordPress development
Getting started with WordPress developmentGetting started with WordPress development
Getting started with WordPress development
 
Childthemes ottawa-word camp-1919
Childthemes ottawa-word camp-1919Childthemes ottawa-word camp-1919
Childthemes ottawa-word camp-1919
 
WordPress Custom Fields: Control your content presentation by breaking out of...
WordPress Custom Fields: Control your content presentation by breaking out of...WordPress Custom Fields: Control your content presentation by breaking out of...
WordPress Custom Fields: Control your content presentation by breaking out of...
 
WordPress Theme Workshop: Part 4
WordPress Theme Workshop: Part 4WordPress Theme Workshop: Part 4
WordPress Theme Workshop: Part 4
 
Seven deadly theming sins
Seven deadly theming sinsSeven deadly theming sins
Seven deadly theming sins
 
How to create a basic template
How to create a basic templateHow to create a basic template
How to create a basic template
 
Builing a WordPress Theme
Builing a WordPress ThemeBuiling a WordPress Theme
Builing a WordPress Theme
 
Various Ways of Using WordPress
Various Ways of Using WordPressVarious Ways of Using WordPress
Various Ways of Using WordPress
 
Arizona WP - Building a WordPress Theme
Arizona WP - Building a WordPress ThemeArizona WP - Building a WordPress Theme
Arizona WP - Building a WordPress Theme
 
&lt;?php + WordPress
&lt;?php + WordPress&lt;?php + WordPress
&lt;?php + WordPress
 
WordPress
WordPressWordPress
WordPress
 
How does get template part works in twenty ten theme
How does get template part works in twenty ten themeHow does get template part works in twenty ten theme
How does get template part works in twenty ten theme
 
Extending WordPress
Extending WordPressExtending WordPress
Extending WordPress
 
Now That's What I Call WordPress Security 2010
Now That's What I Call WordPress Security 2010Now That's What I Call WordPress Security 2010
Now That's What I Call WordPress Security 2010
 
Anatomy of a Wordpress theme
Anatomy of a Wordpress themeAnatomy of a Wordpress theme
Anatomy of a Wordpress theme
 

Mais de Sitdhibong Laokok

แม่แบบและแบบบันทึกสำหรับกระบวนการออกแบบรายละเอียดซอฟต์แวร์
แม่แบบและแบบบันทึกสำหรับกระบวนการออกแบบรายละเอียดซอฟต์แวร์แม่แบบและแบบบันทึกสำหรับกระบวนการออกแบบรายละเอียดซอฟต์แวร์
แม่แบบและแบบบันทึกสำหรับกระบวนการออกแบบรายละเอียดซอฟต์แวร์Sitdhibong Laokok
 
คู่มือประกอบกระบวนการออกแบบรายละเอียดซอฟต์แวร์
คู่มือประกอบกระบวนการออกแบบรายละเอียดซอฟต์แวร์คู่มือประกอบกระบวนการออกแบบรายละเอียดซอฟต์แวร์
คู่มือประกอบกระบวนการออกแบบรายละเอียดซอฟต์แวร์Sitdhibong Laokok
 
กระบวนการออกแบบรายละเอียดซอฟต์แวร์
กระบวนการออกแบบรายละเอียดซอฟต์แวร์กระบวนการออกแบบรายละเอียดซอฟต์แวร์
กระบวนการออกแบบรายละเอียดซอฟต์แวร์Sitdhibong Laokok
 
การนิยามและการปรับปรุงกระบวนการออกแบบรายละเอียดซอฟต์แวร์
การนิยามและการปรับปรุงกระบวนการออกแบบรายละเอียดซอฟต์แวร์การนิยามและการปรับปรุงกระบวนการออกแบบรายละเอียดซอฟต์แวร์
การนิยามและการปรับปรุงกระบวนการออกแบบรายละเอียดซอฟต์แวร์Sitdhibong Laokok
 
Software Metrics: Paper Presentation
Software Metrics: Paper PresentationSoftware Metrics: Paper Presentation
Software Metrics: Paper PresentationSitdhibong Laokok
 
ข้อเสนอโครงการ.ระบบจัดการส่งดอกไม้ของฮานะ
ข้อเสนอโครงการ.ระบบจัดการส่งดอกไม้ของฮานะข้อเสนอโครงการ.ระบบจัดการส่งดอกไม้ของฮานะ
ข้อเสนอโครงการ.ระบบจัดการส่งดอกไม้ของฮานะSitdhibong Laokok
 
SNA: Information Sharing Behavior
SNA: Information Sharing BehaviorSNA: Information Sharing Behavior
SNA: Information Sharing BehaviorSitdhibong Laokok
 
Seminar Slide: Investigating dependencies in software requirements for change...
Seminar Slide: Investigating dependencies in software requirements for change...Seminar Slide: Investigating dependencies in software requirements for change...
Seminar Slide: Investigating dependencies in software requirements for change...Sitdhibong Laokok
 
New M-Culture + Elementary WordPress
New M-Culture + Elementary WordPressNew M-Culture + Elementary WordPress
New M-Culture + Elementary WordPressSitdhibong Laokok
 
WordPress Theme Development Short Manual
WordPress Theme Development Short ManualWordPress Theme Development Short Manual
WordPress Theme Development Short ManualSitdhibong Laokok
 
JAXB: Create, Validate XML Message and Edit XML Schema
JAXB: Create, Validate XML Message and Edit XML SchemaJAXB: Create, Validate XML Message and Edit XML Schema
JAXB: Create, Validate XML Message and Edit XML SchemaSitdhibong Laokok
 
Software Architecture: Test Case Writing
Software Architecture: Test Case WritingSoftware Architecture: Test Case Writing
Software Architecture: Test Case WritingSitdhibong Laokok
 
พระราชบัญญัติ ว่าด้วยการกระทำความผิดเกี่ยวกับคอมพิวเตอร์ พ.ศ. 2550
พระราชบัญญัติ ว่าด้วยการกระทำความผิดเกี่ยวกับคอมพิวเตอร์ พ.ศ. 2550พระราชบัญญัติ ว่าด้วยการกระทำความผิดเกี่ยวกับคอมพิวเตอร์ พ.ศ. 2550
พระราชบัญญัติ ว่าด้วยการกระทำความผิดเกี่ยวกับคอมพิวเตอร์ พ.ศ. 2550Sitdhibong Laokok
 

Mais de Sitdhibong Laokok (15)

แม่แบบและแบบบันทึกสำหรับกระบวนการออกแบบรายละเอียดซอฟต์แวร์
แม่แบบและแบบบันทึกสำหรับกระบวนการออกแบบรายละเอียดซอฟต์แวร์แม่แบบและแบบบันทึกสำหรับกระบวนการออกแบบรายละเอียดซอฟต์แวร์
แม่แบบและแบบบันทึกสำหรับกระบวนการออกแบบรายละเอียดซอฟต์แวร์
 
คู่มือประกอบกระบวนการออกแบบรายละเอียดซอฟต์แวร์
คู่มือประกอบกระบวนการออกแบบรายละเอียดซอฟต์แวร์คู่มือประกอบกระบวนการออกแบบรายละเอียดซอฟต์แวร์
คู่มือประกอบกระบวนการออกแบบรายละเอียดซอฟต์แวร์
 
กระบวนการออกแบบรายละเอียดซอฟต์แวร์
กระบวนการออกแบบรายละเอียดซอฟต์แวร์กระบวนการออกแบบรายละเอียดซอฟต์แวร์
กระบวนการออกแบบรายละเอียดซอฟต์แวร์
 
การนิยามและการปรับปรุงกระบวนการออกแบบรายละเอียดซอฟต์แวร์
การนิยามและการปรับปรุงกระบวนการออกแบบรายละเอียดซอฟต์แวร์การนิยามและการปรับปรุงกระบวนการออกแบบรายละเอียดซอฟต์แวร์
การนิยามและการปรับปรุงกระบวนการออกแบบรายละเอียดซอฟต์แวร์
 
Software Metrics: Paper Presentation
Software Metrics: Paper PresentationSoftware Metrics: Paper Presentation
Software Metrics: Paper Presentation
 
ข้อเสนอโครงการ.ระบบจัดการส่งดอกไม้ของฮานะ
ข้อเสนอโครงการ.ระบบจัดการส่งดอกไม้ของฮานะข้อเสนอโครงการ.ระบบจัดการส่งดอกไม้ของฮานะ
ข้อเสนอโครงการ.ระบบจัดการส่งดอกไม้ของฮานะ
 
SNA: Information Sharing Behavior
SNA: Information Sharing BehaviorSNA: Information Sharing Behavior
SNA: Information Sharing Behavior
 
Seminar Slide: Investigating dependencies in software requirements for change...
Seminar Slide: Investigating dependencies in software requirements for change...Seminar Slide: Investigating dependencies in software requirements for change...
Seminar Slide: Investigating dependencies in software requirements for change...
 
Git installation
Git installationGit installation
Git installation
 
New M-Culture + Elementary WordPress
New M-Culture + Elementary WordPressNew M-Culture + Elementary WordPress
New M-Culture + Elementary WordPress
 
WordPress Theme Development Short Manual
WordPress Theme Development Short ManualWordPress Theme Development Short Manual
WordPress Theme Development Short Manual
 
JAXB: Create, Validate XML Message and Edit XML Schema
JAXB: Create, Validate XML Message and Edit XML SchemaJAXB: Create, Validate XML Message and Edit XML Schema
JAXB: Create, Validate XML Message and Edit XML Schema
 
Software Architecture: Test Case Writing
Software Architecture: Test Case WritingSoftware Architecture: Test Case Writing
Software Architecture: Test Case Writing
 
Introduce to SVN
Introduce to SVNIntroduce to SVN
Introduce to SVN
 
พระราชบัญญัติ ว่าด้วยการกระทำความผิดเกี่ยวกับคอมพิวเตอร์ พ.ศ. 2550
พระราชบัญญัติ ว่าด้วยการกระทำความผิดเกี่ยวกับคอมพิวเตอร์ พ.ศ. 2550พระราชบัญญัติ ว่าด้วยการกระทำความผิดเกี่ยวกับคอมพิวเตอร์ พ.ศ. 2550
พระราชบัญญัติ ว่าด้วยการกระทำความผิดเกี่ยวกับคอมพิวเตอร์ พ.ศ. 2550
 

Último

IaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdf
IaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdfIaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdf
IaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdfDaniel Santiago Silva Capera
 
PicPay - GenAI Finance Assistant - ChatGPT for Customer Service
PicPay - GenAI Finance Assistant - ChatGPT for Customer ServicePicPay - GenAI Finance Assistant - ChatGPT for Customer Service
PicPay - GenAI Finance Assistant - ChatGPT for Customer ServiceRenan Moreira de Oliveira
 
RAG Patterns and Vector Search in Generative AI
RAG Patterns and Vector Search in Generative AIRAG Patterns and Vector Search in Generative AI
RAG Patterns and Vector Search in Generative AIUdaiappa Ramachandran
 
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
 
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
 
Cybersecurity Workshop #1.pptx
Cybersecurity Workshop #1.pptxCybersecurity Workshop #1.pptx
Cybersecurity Workshop #1.pptxGDSC PJATK
 
AI Fame Rush Review – Virtual Influencer Creation In Just Minutes
AI Fame Rush Review – Virtual Influencer Creation In Just MinutesAI Fame Rush Review – Virtual Influencer Creation In Just Minutes
AI Fame Rush Review – Virtual Influencer Creation In Just MinutesMd Hossain Ali
 
Babel Compiler - Transforming JavaScript for All Browsers.pptx
Babel Compiler - Transforming JavaScript for All Browsers.pptxBabel Compiler - Transforming JavaScript for All Browsers.pptx
Babel Compiler - Transforming JavaScript for All Browsers.pptxYounusS2
 
UiPath Platform: The Backend Engine Powering Your Automation - Session 1
UiPath Platform: The Backend Engine Powering Your Automation - Session 1UiPath Platform: The Backend Engine Powering Your Automation - Session 1
UiPath Platform: The Backend Engine Powering Your Automation - Session 1DianaGray10
 
UiPath Studio Web workshop series - Day 6
UiPath Studio Web workshop series - Day 6UiPath Studio Web workshop series - Day 6
UiPath Studio Web workshop series - Day 6DianaGray10
 
How to Effectively Monitor SD-WAN and SASE Environments with ThousandEyes
How to Effectively Monitor SD-WAN and SASE Environments with ThousandEyesHow to Effectively Monitor SD-WAN and SASE Environments with ThousandEyes
How to Effectively Monitor SD-WAN and SASE Environments with ThousandEyesThousandEyes
 
IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019
IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019
IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019IES VE
 
Computer 10: Lesson 10 - Online Crimes and Hazards
Computer 10: Lesson 10 - Online Crimes and HazardsComputer 10: Lesson 10 - Online Crimes and Hazards
Computer 10: Lesson 10 - Online Crimes and HazardsSeth Reyes
 
Crea il tuo assistente AI con lo Stregatto (open source python framework)
Crea il tuo assistente AI con lo Stregatto (open source python framework)Crea il tuo assistente AI con lo Stregatto (open source python framework)
Crea il tuo assistente AI con lo Stregatto (open source python framework)Commit University
 
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...DianaGray10
 
20200723_insight_release_plan_v6.pdf20200723_insight_release_plan_v6.pdf
20200723_insight_release_plan_v6.pdf20200723_insight_release_plan_v6.pdf20200723_insight_release_plan_v6.pdf20200723_insight_release_plan_v6.pdf
20200723_insight_release_plan_v6.pdf20200723_insight_release_plan_v6.pdfJamie (Taka) Wang
 
NIST Cybersecurity Framework (CSF) 2.0 Workshop
NIST Cybersecurity Framework (CSF) 2.0 WorkshopNIST Cybersecurity Framework (CSF) 2.0 Workshop
NIST Cybersecurity Framework (CSF) 2.0 WorkshopBachir Benyammi
 
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
 
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...Will Schroeder
 
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)

IaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdf
IaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdfIaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdf
IaC & GitOps in a Nutshell - a FridayInANuthshell Episode.pdf
 
PicPay - GenAI Finance Assistant - ChatGPT for Customer Service
PicPay - GenAI Finance Assistant - ChatGPT for Customer ServicePicPay - GenAI Finance Assistant - ChatGPT for Customer Service
PicPay - GenAI Finance Assistant - ChatGPT for Customer Service
 
RAG Patterns and Vector Search in Generative AI
RAG Patterns and Vector Search in Generative AIRAG Patterns and Vector Search in Generative AI
RAG Patterns and Vector Search in Generative AI
 
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...
 
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
 
Cybersecurity Workshop #1.pptx
Cybersecurity Workshop #1.pptxCybersecurity Workshop #1.pptx
Cybersecurity Workshop #1.pptx
 
AI Fame Rush Review – Virtual Influencer Creation In Just Minutes
AI Fame Rush Review – Virtual Influencer Creation In Just MinutesAI Fame Rush Review – Virtual Influencer Creation In Just Minutes
AI Fame Rush Review – Virtual Influencer Creation In Just Minutes
 
Babel Compiler - Transforming JavaScript for All Browsers.pptx
Babel Compiler - Transforming JavaScript for All Browsers.pptxBabel Compiler - Transforming JavaScript for All Browsers.pptx
Babel Compiler - Transforming JavaScript for All Browsers.pptx
 
UiPath Platform: The Backend Engine Powering Your Automation - Session 1
UiPath Platform: The Backend Engine Powering Your Automation - Session 1UiPath Platform: The Backend Engine Powering Your Automation - Session 1
UiPath Platform: The Backend Engine Powering Your Automation - Session 1
 
UiPath Studio Web workshop series - Day 6
UiPath Studio Web workshop series - Day 6UiPath Studio Web workshop series - Day 6
UiPath Studio Web workshop series - Day 6
 
How to Effectively Monitor SD-WAN and SASE Environments with ThousandEyes
How to Effectively Monitor SD-WAN and SASE Environments with ThousandEyesHow to Effectively Monitor SD-WAN and SASE Environments with ThousandEyes
How to Effectively Monitor SD-WAN and SASE Environments with ThousandEyes
 
IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019
IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019
IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019
 
Computer 10: Lesson 10 - Online Crimes and Hazards
Computer 10: Lesson 10 - Online Crimes and HazardsComputer 10: Lesson 10 - Online Crimes and Hazards
Computer 10: Lesson 10 - Online Crimes and Hazards
 
Crea il tuo assistente AI con lo Stregatto (open source python framework)
Crea il tuo assistente AI con lo Stregatto (open source python framework)Crea il tuo assistente AI con lo Stregatto (open source python framework)
Crea il tuo assistente AI con lo Stregatto (open source python framework)
 
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
 
20200723_insight_release_plan_v6.pdf20200723_insight_release_plan_v6.pdf
20200723_insight_release_plan_v6.pdf20200723_insight_release_plan_v6.pdf20200723_insight_release_plan_v6.pdf20200723_insight_release_plan_v6.pdf
20200723_insight_release_plan_v6.pdf20200723_insight_release_plan_v6.pdf
 
NIST Cybersecurity Framework (CSF) 2.0 Workshop
NIST Cybersecurity Framework (CSF) 2.0 WorkshopNIST Cybersecurity Framework (CSF) 2.0 Workshop
NIST Cybersecurity Framework (CSF) 2.0 Workshop
 
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...
 
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...
 
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
 

Introduction to WordPress Theme Development

  • 1. WordPress Introduction to create your own theme CC:BY-NC
  • 2. Info. Name: Sitdhibong Laokok Contact: sitdhibong@gmail.com Class Name: WordPress Theme Dev. Office Hours: 24/7 (for e-mail)
  • 3. Checklist ✓ Download WordPress 3.x+ http:/ /www.wordpress.org/ http://www.wordpress.org/download ✓ Web server (Public or localhost) ✓ PHP 5.2+ ✓ Database (MySQL might be good) ✓ Make it works http://codex.wordpress.org/Installing_WordPress
  • 4. Serf the Web http://we.in.th
  • 5. Web Site WordPress Plugin W http://we.in.th WordPress Theme
  • 6. Example for page structures header There is loop inside this block content sidebar for display blog entry ? Lo o p footer Note: I can rearrange page structure whatever I want.
  • 7. WordPress theme in the real world er head si d eb t ar en nt co
  • 8. Example for Template *A lot more at http://wordpress.org/extend/themes
  • 10. Minimum file for theme • style.css: required for inform theme information • header.php: theme header • index.php: main template • single.php: single post display • page.php: template for static home page • footer.php: theme footer • functions.php: functions file
  • 11. style.css /* Theme Name: Abracadabra Theme URI: http://we.in.th/theme/abracadabra Theme Description: Just kidding the theme does not exists Author: Apps Tree Info Author URI: http://we.in.th/ Version: 0.1.0 Tags: black, white, two-columns License: GPL 2.0 License URI: license.txt */ body { http://codex.wordpress.org/File_Header padding: 0; margin: 0; } . . .
  • 12. Twenty Eleven theme screenshot.png WordPress use for theme thumbnail Version Author Theme Name Description Tags
  • 13. What is the Loop ? The Loop is used by WordPress to display each of your posts. Enter the Loop Yep Query for blog Have Display posts posts ? post No more post Exit
  • 14. Here’s the Loop 01: <?php 02: / index.php / 03: get_header(); / get content from ‘header.php’ ?> / 04: Loop start here (07-15) 05: <div id=”sl-content-wrap”> 06: <?php if ( have_posts() ) : ?> 07: <?php while( have_posts() ) : the_post(); ?> 08: <div id=”post-<?php the_ID(); ?>” <?php post_class(); ?> 09: <a href=”<?php the_permalink(); ?>” title=”<?php the_title(); ?>”> 10: <h1><?php the_title(); ?></h1> 11: </a> 12: <p><?php the_content(); ?></p> 13: <p><?php the_tags(‘Tag: ‘, ‘,’, ‘.’); ?></p> have_posts, the_post, 14: </div> the_ID, post_class, 15: <?php endwhile; ?> the_permalink, the_title, 16: <?php endif; ?> the_content, the_tags are 17: </div> not PHP’s func. 18: 19: <?php get_sidebar(); / display content from ‘sidebar.php’ ?> / 20: 21: <?php get_footer(); / display content from ‘footer.php’ ?> /
  • 15. the things we’ve get from loop Loop result (04-10) 01: <!-- Header HTML - above --> 02: <!-- In this case: there is only one blog entry --> 03: <div id=”sl-content-wrap”> 04: <div id=”post-1” class=”blog-post text ...”> 05: <a href=”http://www.we.in.th/lorem-ipsum” title=”Lorem Ipsum”> 06: <h1>Lorem Ipsum</h1> 07: </a> 08: <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet magna aliquam eret volutpat.</p> 09: <p>Tag: dummy, WP, Template.</p> 10: </div> 11: </div> 12: 13: <!-- Sidebar HTML --> 14: 15: <!-- Footer HTML - below -->
  • 16. What are tags from previous code ? - It’s called ‘template tags’, here the often use template tags • the_content() • the_meta() • the_title() • the_ID() • the_permalik() • the_post_thumbnail() • the_category() • the_author() • the_tags() • the_shortlink() • the_date() • edit_post_link() • the_time() http://codex.wordpress.org/Template_Tags • the_excerpt()
  • 17. More Info. • WordPress Codex • WordPress Theme and Design Presentation - Menn Chris

Notas do Editor

  1. \n
  2. \n
  3. \n
  4. \n
  5. \n
  6. \n
  7. \n
  8. \n
  9. \n
  10. \n
  11. \n
  12. \n
  13. \n
  14. \n
  15. \n
  16. \n
  17. \n