Thursday, September 25, 2014

1st Project

 1. Header





Header is Divided into Two Parts

         Logo          

              Menubar



Coding Part :




<!doctype html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Foundation | Welcome</title>
<link rel="stylesheet" href="css/foundation.css" />
<link rel="stylesheet" href="css/style.css" />
<script src="js/vendor/modernizr.js"></script>
</head>
<body>

<!-- This is Border class  -->


<div class="row">
<div class="large-12">

<!-- This is the logo  -->

<div class="row">
<div class="large-12">
<div class="large-4 columns">
<img src="img/logo.png">
</div>  <!—Logo Div Close-->




<!-- This is the Menu Bar -->

<div class="large-8 columns">
<nav class="top-bar" data-topbar role="navigation">
<section class="top-bar-section">

<!-- Left Nav Section -->

<ul class="left">
<li><a href="#">Home</a></li>
<li><a href="#">About Us</a></li>
<li><a href="#">Services</a></li>
<li><a href="#">Contact us</a></li>
</ul>
</section>
</nav>
</div>    <!—Menu Bar Div Close-->
</div>   <!—Class-12 Div Close-->
</div>   <!— Row Div Close-->

 </div>
</div>

2. Banner



Coding of Banner:-


<!-- This is the Banner-->


<div class="row">
<div class="large-12 columns">
<img src="img/banner.png">
</div>

</div>


3. Slider





Coding of the Slider:-


<!-- This is the Slider-->


<div class="row">
<div class="large-12 columns">
<ul class="example-orbit" data-orbit>
<li>
<img src="img/fox.png" alt="slide 1" />
<div class="orbit-caption">
Caption One.
</div>
</li>
<li class="active">
<img src="img/fox.png" alt="slide 2" />
<div class="orbit-caption">
Caption Two.
</div>
</li>
<li>
<img src="img/fox.png" alt="slide 3" />
<div class="orbit-caption">
Caption Three.
</div>
</li>

</ul>     <!—Unordered List Div Close-->

</div>   <!—Large-12  Div Close-->

</div>   <!—Row Div Close-->

4. Content Bar :-



Coding of the Content Bar:-


<!--This is the Content Bar   -->


<div class="row">
<div class="large-12 columns">
<div class="large-4 columns">
<img src="img/about.png">
<h4>About Us</h4>
<p>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s
</p>
</div>


<div class="large-4 columns">
<img src="img/services.png">
<h4>Services</h4>
<p>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s
</p>
</div>

<div class="large-4 columns">
<h4>Testimonial</h4>
<p>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s
</p>
</div>

</div>   <!—Large-12  Bar Div Close-->

</div>   <!—Row  Div Close-->






Posted by at No comments:

Monday, September 15, 2014

Project Work

How we can Make a Responsive Web Design


// Index Page




About Us Page




Services



Portfolio


Contact Us


Posted by at No comments:

Friday, September 5, 2014

Widget Creation in Wordpress

// Sidebar Footer Column in functions.php


register_sidebar( array(
'id' => 'Sidebar Footer smile-1',
'name' => __( 'Sidebar Footer smile', 'foundation' ),
'description' => __( 'This sidebar is located in column Smile of your theme footer.', 'foundation' ),
'before_widget' => '<div class="fl_left clear">',
'after_widget' => '</div>',
'before_title' => '<h5>',
'after_title' => '</h5>',
) );





// Call this widget in footer.php

<div class="wrapper row4">
  <div class="rnd">
    <div id="footer" class="clear">
      <!-- ####################################################################################################### -->
       <?php if ( dynamic_sidebar('Sidebar Footer smile') ) : elseif( current_user_can( 'edit_theme_options' ) ) : ?>

<h5><?php _e( 'No widgets found.', 'foundaton' ); ?></h5>
<p><?php printf( __( 'It seems you don\'t have any widgets in your sidebar! Would you like to %s now?', 'foundation' ), '<a href=" '. get_admin_url( '', 'widgets.php' ) .' ">populate your sidebar</a>' ); ?></p>
<?php endif; ?>
   
      <!-- ####################################################################################################### -->
    </div>
  </div>
</div>
Posted by at No comments:

Theam Options in Wordpress

// Make Changes in Theame Options.php file




//****=============================================================================****//
//****-----------This code is used for Box one Settings----------****//
//****=============================================================================****//

$options[] = array( "name" => "Home page",
"type" => "heading");

$options[] = array( "name" => "Box One Image",
"desc" => "Home page First Image",
"id" => "box_one_image",
"std" => "",
"type" => "upload");

$options[] = array( "name" => "Box One Heading",
"desc" => "Home page First Heading",
"id" => "box_one_heading",
"std" => "",
"type" => "text");

$options[] = array( "name" => "Box One Description",
"desc" => "Home page First Per",
"id" => "box_one_text",
"std" => "",
"type" => "textarea");


$options[] = array( "name" => "Box One  Read more Link",
"desc" => "Home page First Link",
"id" => "box_one_link",
"std" => "",
"type" => "text");

$options[] = array( "name" => "Box One  Read more Text",
"desc" => "Home page First Link Text",
"id" => "box_one_link_text",
"std" => "",
"type" => "text");







$options[] = array( "name" => "Box Two Image",
"desc" => "Home page First Image",
"id" => "box_two_image",
"std" => "",
"type" => "upload");

$options[] = array( "name" => "Box Two Heading",
"desc" => "Home page First Heading",
"id" => "box_two_heading",
"std" => "",
"type" => "text");

$options[] = array( "name" => "Box Two Description",
"desc" => "Home page First Per",
"id" => "box_two_text",
"std" => "",
"type" => "textarea");


$options[] = array( "name" => "Box Two Read more Link",
"desc" => "Home page First Link",
"id" => "box_two_link",
"std" => "",
"type" => "text");

$options[] = array( "name" => "Box Two Read more Text",
"desc" => "Home page First Link Text",
"id" => "box_two_link_text",
"std" => "",
"type" => "text");







$options[] = array( "name" => "social icon",
"type" => "heading");

$options[] = array( "name" => "icon-1",
"desc" => "facebook icon",
"id" => "icon-fb",
"std" => "",
"type" => "upload");


$options[] = array( "name" => "icon-2",
"desc" => "facebook google",
"id" => "icon-google",
"std" => "",
"type" => "upload");


















// Make this file in front-page.php



<div class="large-12 columns margin">
     
     
     
       <div class="large-4 medium-4 columns ">
<div class="box-border">
               
                 <?php if ( get_option('box_one_image') !='' ) { ?>
                 <img src="<?php echo get_option('box_one_image'); ?>" class="boximage" />
                        <?php } else { ?>
                   
                        <?php } ?>
                       

<div class="text">
                          <?php if ( get_option('box_one_heading') !='' ) { ?>
                <h5><?php echo get_option('box_one_heading'); ?></h5>
                        <?php } else { ?>
                 
                        <?php } ?>
                       
                       
<?php if ( get_option('box_one_text') !='' ) { ?>
                <p><?php echo get_option('box_one_text'); ?></p>
                        <?php } else { ?>
                 
                        <?php } ?>


<?php if ( get_option('box_one_link_text') !='' ) { ?>
               <a href="<?php echo get_option('box_one_link'); ?>" class="right"><?php echo get_option('box_one_link_text'); ?></a>
                        <?php } else { ?>
                 
                        <?php } ?>




</div>
</div>
    </div>
 
       <div class="large-4 medium-4 columns ">
<div class="box-border">

   <?php if ( get_option('box_two_image') !='' ) { ?>
                 <img src="<?php echo get_option('box_two_image'); ?>" class="boximage" />
                        <?php } else { ?>
                   
                        <?php } ?>
                       

<div class="text">
                          <?php if ( get_option('box_two_heading') !='' ) { ?>
                <h5><?php echo get_option('box_two_heading'); ?></h5>
                        <?php } else { ?>
                 
                        <?php } ?>
                       
                       
<?php if ( get_option('box_two_text') !='' ) { ?>
                <p><?php echo get_option('box_two_text'); ?></p>
                        <?php } else { ?>
                 
                        <?php } ?>


<?php if ( get_option('box_two_link_text') !='' ) { ?>
               <a href="<?php echo get_option('box_two_link'); ?>" class="right"><?php echo get_option('box_two_link_text'); ?></a>
                        <?php } else { ?>
                 
                        <?php } ?>




</div>
</div>
    </div>
</div>



Posted by at No comments:
Subscribe to: Posts (Atom)