-
▼
2013
(302)
-
▼
February
(17)
- How to Use an iFrame in WordPress
- How to Create a Separate Blog Roll on WordPress
- How to Upload New Header Images for a WordPress Theme
- How to Create a Grid in WordPress
- How to Place Chitika Ads on WordPress
- How to Set a Post Thumbnail in WordPress
- How to Use Wordpress Widgets
- How to Display Posts Outside of WordPress
- How to Import an ActiveRain Blog to WordPress
- How to Import Articles Into WordPress
- How to Show Breadcrumbs in a WordPress Blog
- How to Create a Line Separator in WordPress
- How to Add Line Spaces in WordPress
- How to Import WordPress Users Into Joomla!
- How to Insert Shortcode Into a WordPress Page
- How to Move Wordpress to Root
- How to Change the Default Homepage in WordPress
-
▼
February
(17)
adsense
How to Change the Default Homepage in WordPress
Changing The Header
1. Modify the default header by logging into the administrative end of your WordPress installation and clicking on the Appearance, then Custom Header link, located on the left side navigation.
2. Modify the blog title font color used by clicking on the font color button located under the header and select a different color. Note that the tag line below the title does not change but instead remains white.
3. Experiment with the upper and lower color buttons located under the header to exploit the gradient feature. Note the Revert button, which allows you to return to the default settings of the header.
4. Test the advanced button where you have the ability to enter in specific hexadecimal color values for each header characteristic mentioned. Click the Update Header button when you are satisfied with your changes.
Replacing the Background Image of the Header
5. To replace the background image of the header, download the default background image (Kubrickheader.jpg) from the images folder (Yoursiteroot\\wp-content\\themes\\default\\images) to your desktop.
6. Open the Kubrickheader.jpg image in your favorite graphic software and experiment by laying additional layers over the blue background to create something unique. When satisfied with the new image, save it as Newheader.jpg and upload the image back into the images folder as described in Step 1.
7. Return to the administrative page and click on the Appearance, then Editor link, located on the left side navigation. Locate and open Style.css file from the list of pages on the right side of your browser window.
8. Locate the header style \'#header\' and change only the image path from (Images/Kubrickheader.jpg) to (Images/Newheader.jpg), so it points to your new image. Reload your homepage to see your new background image.
Changing the Footer
9. Navigate to the Appearance, then Editor link, and open the footer.php page located on the right side of your web browser.
10. Locate the following text:
- - - - -
is proudly powered by
WordPress
11. Edit the text to suit your needs. Typically users like to include a copyright symbol and the date, and remove the \'Powered by WordPress link.\' To do this you need to change the text mentioned in Step 2 to the following and click update file.
- - - - -
Copyright © 2010
Changing the Navigation Position
12. Navigate to the Appearance, then Editor link, and open the Style.css page located on the right side of your web browser. Locate the following:
- - - - -
.narrowcolumn {
float: left
GO
padding: 0 0 20px 45px
GO
margin: 0px 0 0
GO
width: 450px
GO
}
13. Replace the narrowcolumn style in Step 1 with the code below. Note that we are only changing the float and padding settings to the opposite of the default settings.
- - - - -
.narrowcolumn {
float: right
GO
padding: 0 45px 20px 0px
GO
margin: 0px 0 0
GO
width: 450px
GO
}
14. Also in the Style.css file find the following:
- - - - -
#sidebar
{
padding: 20px 0 10px 0
GO
margin-left: 545px
GO
width: 190px
GO
}
15. Replace the sidebar style in Step 3 with the code below. Note that we are only changing the margin-left setting which is basically bringing the sidebar containing the navigation left.
- - - - -
#sidebar
{
padding: 20px 0 10px 0
GO
margin-left: 20px
GO
width: 190px
GO
}
16. Click the Update File button and check your work by reloading the front end of your website.
8:46 AM | Filed Under | 0 Comments
Comments
Popular Posts
-
1. Log in to your Weebly account. 2. Click 'Theme Editor.' 3. Click on the 'Design' tab. 4. Select 'Edit CSS/HTM...
-
1. Sign up for a publisher account at Bidvertiser. Submit basic contact information and confirm your email address to get started. 2. Lo...
-
1. Log in to your WordPress dashboard. 2. Open the 'Appearance' section on the left side of the WordPress dashboard and then cli...
-
1. Open your WordPress Dashboard in your preferred browser. It is accessed at the '/wp-admin' location of your site. For example, ...
-
Facebook Widget 1. Create a Facebook fan page for your blog, if you don't already have one. You will have to manually share content wi...
-
1. Download and install the WordPress for BlackBerry app via BlackBerry App World. Download the version that corresponds with your BlackBe...
-
1. Go to your WordPress blog's administrative control panel. 2. Click the 'Settings' button on the left-side navigation menu...
-
1. Click the 'Add Contact' button on the 'Add New Post' page. This opens the 'Add a Contact Form' page. 2. Click...
-
1. Register an account with Amazon Web Services Cloud. If you have an existing Amazon account, enter your email address in the appropriate...
-
1. Log into your WordPress.com account using your user name and password. 2. Hover your cursor over the 'My Blogs' tab at the to...
Post a Comment