Bootstrap And WordPress Theme Integration In 6 Easy Steps - PowerPoint PPT Presentation

View by Category
About This Presentation
Title:

Bootstrap And WordPress Theme Integration In 6 Easy Steps

Description:

Bootstrap And WordPress Theme Integration In 6 Easy Steps – PowerPoint PPT presentation

Number of Views:4
Slides: 9
Provided by: hirewpgeeks
Category: Other

less

Write a Comment
User Comments (0)
Transcript and Presenter's Notes

Title: Bootstrap And WordPress Theme Integration In 6 Easy Steps


1
Bootstrap And WordPress Theme Integration In 6
Easy Steps
2
  • Email ussales_at_hirewpgeeks.com
  • Call us 1.949.591.8153

6 EASY STEPS FOR BOOTSTRAP AND WORDPRESS THEME
INTEGRATION
One can easily convert a website to WordPress
theme by integrating WordPress and Bootstrap so
that the design, as well as the content of their
former website, remains intact. Before starting
this tutorial, lets lay an eye on the
pre-requisites for the same ? basic
knowledge of WordPress working, creating
themes, etc ? basic understanding of the
HTML language
3
  • Email ussales_at_hirewpgeeks.com
  • Call us 1.949.591.8153

1. CREATION OF THE BOOTSTHEME FOLDER
  • Install WordPress and download Bootstrap. After
    selecting the Theme folder within wp-content,
    create a new folder named BootSTheme. Unzip the
    contents of Bootstrap into this new folder.
  • Now within the same folder, create four new files
    (all empty) and name them as
  • ? footer.php
  • ? header.php
  • ? index.php

4
  • Email us sales_at_hirewpgeeks.com
  • Call us 1.949.591.8153

2. PROVIDING DETAILS FOR THE THEME
  • To provide the basic details about your theme,
    copy the following code into the style.css file
    (enter the details according to your theme)
  • /
  • Theme Name
  • Theme URI
  • Description

5
  • Email us sales_at_hirewpgeeks.com
  • Call us 1.949.591.8153

4. SETTING UP THE HEADER AND FOOTER
  • If you dont know how to convert a website to
    WordPress theme, first of all, download a free,
    basic HTML template to ease the documentation
    part.
  • Now, copy the header part and paste it in the
    header.php file, and the footer part in the
    footer.php file. (Dont forget to make changes
    according to your website!)
  • If you upload this bootstrap WordPress integrated
    theme and run it, you will see the essential
    contents on the page, and nothing else, not even
    the styling.

6
  • Email us sales_at_hirewpgeeks.com
  • Call us 1.949.591.8153

5. IMPORTING STYLESHEETS, JAVASCRIPT AND
CUSTOMISATION
  • Add the following code in the beginning of the
    header.php file to merge style.css with the
    website
  • To add the JavaScript features, open the
    footer.php file and enter the following code just
    before the closing body tag
  • Customisation

7
  • Email us sales_at_hirewpgeeks.com
  • Call us 1.949.591.8153

6. DYNAMIC POST CALLING
  • To have a website with features like dynamic post
    calling, paste the following code in index.php
    file
  • lt?php
  • query_posts(posts_per_page1)
  • while(have_posts()) the_post() ?gt
  • ltdivgt
  • lth2gtlta hreflt?php the_permalink() ?gtgtlt?php
    the_title() ?gtlt/agtlt/h2gt
  • ltpgtlt?php the_excerpt() ?gtlt/pgt
  • lt/divgt
  • lt?php endwhile wp_reset_query() ?gt

8
Contact Us
We are always happy to make valuable new
contacts.
https//www.hirewpgeeks.com/
sales_at_hirewpgeeks.com
127 Palm Street San Francisco, CA 94111 USA
1.949.591.8153
About PowerShow.com