Tuesday, July 22, 2014

Create rounded border for Menu using CSS

Everyone wants a stylish website. There are many ways to stylize your website. Suppose you want to change your menu layout like you want a rounded border. You can get it from your style.css file. Just follow few steps given bellow. 
Go to your style.css file. Find out css class or id for your website’s menu. Now copy the codes given bellow – 
border:1px solid #3c3c3c;                                                                                                                   
border-top-left-radius: 5px;                                                                                                                 
border-bottom-left-radius: 5px;                                                                                                           
border-top-right-radius: 5px;                                                                                                               
border-bottom-right-radius: 5px;                                                                                                         

Paste it in the place of your menu border in style.css. Replace #3c3c3c with your own color. Now save the file and check it. 

You can change the radius size as you want. But the given size is better I think. Try it yourself. Thank you so much. 

Monday, July 21, 2014

If you want to customize any of the pages of your WordPress site you have to follow some instructions. Today I’ll share the easy instructions to you.
At first copy the page.php file from your theme. Then paste it at same place. It will be “page - Copy.php”. Now rename the file as “your-template-name.php”. Now open it using Notepad + +. Find out -
                                                <?php get_header(); ?>                                                                           
Replace this code with 
<?php                                                                                                                                                     
/*                                                                                                                                                            
Template Name: Custom Template                                                                                                          
 */                                                                                                                                                           
get_header(); ?>                                                                                                                                     
Now find out these codes –
<?php while ( have_posts() ) : the_post(); ?>                                                                                          
                                                            <?php get_template_part( 'content', 'page' ); ?>                          
                                                <?php endwhile; ?>                                                                                
Replace these codes with your own custom design’s code.
Now include styles of your newly added code in your theme’s style.css.
You have just created your own custom template. Now go to your dashboard, click on Add New Page. You will get a new option in your page editor named “Template”. Chose your newly created custom template from the list and publish the page.

Now view your page and check if it is working.