WP Video Tuts Note - 01

on
WP Video Tuts Note - 01

 These are the short notes just to remember What I learn from video tutorial Series.
All basic functions and tags

_______________________________

style.css
_______________________________

/*
Theme Name : Learning;
Description: My First Wordpress Template;
Author: R K;
Author URI: http://www.abc.com;
Tags: learning, premium theme, ;
*/
body{
margin:0;
padding:0;
}
.container{
width: 960px;
margin:0 auto;
}
h1,h2,h3,h4,h5,h6{margin:0;}
/*-------------------------------
01. HEADER SECTION
--------------------------------*/
header{
width: 100%;
height: 150px;
background: #f0f0f0;
}
.logo{
width:100%;
text-align:center;
height:110;
}
.menu{
width:100%;
height:40px;
background: #333;
}
.menu{
list-style: none;
margin:0;
padding: 0
}
.menu li{
float: left;
margin-right: 10px;
}
.menu li a{
padding: 10px 20px;
color: #fff;
text-decoration: none;
display: inline-block;
}

/*-------------------------------
02. CONTENT SECTION
--------------------------------*/
.site-content{
width: 960px;
margin:0 auto;
overflow: hidden;
}
.main-content{
width:70%;
float:left;
background-color: #f0f0f0;
height: 600px;
}

/*-------------------------------
03. SIDEBAR SECTION
--------------------------------*/
.main-sidebar{
width: 30%;
float: right;
background: #ccc;
height:600px;
}
/*-------------------------------
04. WIDGET SECTION
--------------------------------*/
.widget{
padding: 10px;
width: 100%;
margin-bottom: 10px;
}
.widget-title{
width: 100%;
padding: 5px;
text-align: center;
background: #333;
color: #fff;
}

/*-------------------------------
05. FOOTER SECTION
--------------------------------*/

footer{
width: 100%;
height: 200px;
background: #333;
}
.footer-col{
width: 32%;
float: left;
margin-right: 10px;

}


_______________________________

index.php
_______________________________

 <?php
/*
Theme index file
*/
get_header();
?>
<div class="main-content">

</div>
<div class="main-sidebar">
<?php get_sidebar(); ?>

</div>

 <?php
get_footer();
?>

_______________________________

 header.php
_______________________________

<?php
/*
Theme header file
*/

?>
<html>
<head>
<meta charset="UTF-8">
<title><?php bloginfo('name');?>-<?php bloginfo('description');?></title>
<link rel="stylesheet" href="<?php echo get_stylesheet_uri();?>">
</head>
<body>
<header>
<div class="container">
<div class="logo"><a href="<?php bloginfo('url'); ?>"><img src="<?php echo  get_template_directory_uri();?>/images/logo.png" width="150px";height="auto" alt=""></a></div>
<div class="menu-container">
<?php
wp_nav_menu(
array(
'theme_location' => 'primary',
'menu_class' => 'menu',
'menu_id' => 'menu_id',

));?>
</div>


</div>

</header>

<div class="site-content">


_______________________________

functions.php
_______________________________

<?php
/*
Theme Function file
*/
register_nav_menus( array(

'primary' => __('Main Menu', 'learning'),
'footer' => __('Footer Menu', 'learning')

)

);

function learning_widget_init(){

register_sidebar( array(

'name' => __('Main Sidebar'),
'id'   => 'main-sidebar',
'description' => __('Widget Are For Sidebar at Homepage', 'learning'),
'before_widget' => '<div class="widget">',
'after_widget'  => '</div>',
'before_title'  => '<h3 class="widget-title">',
'after_title' => '</h3>'

));

register_sidebar( array(

'name' => __('Footer Widget 1', 'learning'),
'id'   => 'footer-1',
'description' => __('Widget Area 1 For Footer', 'learning'),
'before_widget' => '<div class="widget">',
'after_widget'  => '</div>',
'before_title'  => '<h3 class="widget-title">',
'after_title' => '</h3>'

));

register_sidebar( array(

'name' => __('Footer Widget 2', 'learning'),
'id'   => 'footer-2',
'description' => __('Widget Area 1 For Footer', 'learning'),
'before_widget' => '<div class="footer-widget">',
'after_widget'  => '</div>',
'before_title'  => '<h3 class="widget-title">',
'after_title' => '</h3>'

));

register_sidebar( array(

'name' => __('Footer Widget 3', 'learning'),
'id'   => 'footer-3',
'description' => __('Widget Area 1 For Footer', 'learning'),
'before_widget' => '<div class="footer-widget">',
'after_widget'  => '</div>',
'before_title'  => '<h3 class="widget-title">',
'after_title' => '</h3>'

));




}
add_action('widgets_init', 'learning_widget_init');

_______________________________

sidebar.php
_______________________________

<?php
/*
Theme Sidebar file
*/

?>
<aside id="sidebar">
<?php dynamic_sidebar('main-sidebar');?>


</aside>





Comments

Post a Comment