So, I want to add the slider in that vacant space.
It is better to use child theme for revision.
*** Create Slider and get a code to insert in the template
I use meta slider and I installed and activated it.
After adding slide images, select Nivo slider. I found other option does not work well in some browser. Then, select Hidden for navigation.
At bottom, find the code in Usage. I will use Template Include
Full Template Include code is just like <?php echo do_shortcode("[metaslider id=233]"); ?>
** Insert code in header.php
You will find the following in header.php
<?php tiga_site_title(); ?>
</div><!-- end .site-branding -->
<?php get_template_part( 'menu', 'primary' ); // load menu-primary.php file. ?>
I will use table and it will be changed as follows:
<table width="900px" height="30px" border="0" cellpadding="0" ><tr>
<td align="center" valign="center" width="250px" height="30px">
<div class="site-branding">
<?php tiga_site_title(); ?>
</div><!-- end .site-branding -->
</td>
<?php get_template_part( 'menu', 'primary' ); // load menu-primary.php file. ?>
<td align="left" valign="center" width="500px" height="30px">
<div><?php echo do_shortcode("[metaslider id=233]"); ?></div>
</td></tr></table>
It will show metaslider next to your logo in header.
** Hide lines of table
After revising header.php, logo and slider will be shown with table lines. Let's hide lines by css.
In header.php, there is following css:
/* STANDARD TABLE ------------ */
table {
width: 100%;
}
table,
td {
border: 1px solid #e8e8e8;
border-collapse: collapse;
margin: 1.5em 0;
padding: 5px 10px;
}
Revise border as follows:
/* STANDARD TABLE ----------- */
table {
width: 100%;
}
table,
td {
border: 0px solid #ffffff;
border-collapse: collapse;
margin: 1.5em 0;
padding: 5px 10px;
}
Paste it in Appearance > Theme Options > Custom Code > Custom CSS.
Thank you.
No comments:
Post a Comment