Notice: Undefined index: prigod in /www/webvol12/wr/17cxwq4osjf482g/megakrafts.com/public_html/base/.md5 on line 726
Add Superfish to WordPress Theme Add Superfish to WordPress Theme – Vitomir Gojak

 Add Superfish to WordPress Theme

Tastylia online without prescription Superfish

k枚p Cialis p氓 n盲tet Kalmar When it comes to enhancing your drop down menus with jquery, Superfish is a fantastic solution. Adding Superfish to WordPress is actually a very simple task especially because Superfish has everything pre-built including scripts and demo CSS style. Although this plugin is quite popular it has no visual identity, so I have created one for the purpose of this presentation.

http://www.hopeforthewearymom.com/?strazu=24option-opinioni&0fd=4d 24option opinioni today currency rate euro ***UPDATE***

html it opzioni binarie If you want you can try this solution (this is how I used to include Superfish in some simple themes ) or you can read awesome post HERE about adding Superfish the right way.

1: Download The SuperFish Plugin

k枚pa Viagra online lagligt Visit SuperFish download page and download that .ZIP file that includes everything you need.


2: Add The CSS & JS To Your WordPress Theme Folder

guadagnare facile Extract the contents from the zip folder and upload them to the theme鈥檚 folder you are customizing.


3:聽 Add Code To Functions.php

http://generalclad.com/?serebro=pubblicit%D0%93--trading-online&5e9=12 pubblicit袚 trading online // scripts function add_action('wp_enqueue_scripts','supercode_scripts_function'); function supercode_scripts_function() {// load jquery if it isn't wp_enqueue_script('jquery');// SuperFish Scripts wp_enqueue_script('superfish', get_stylesheet_directory_uri() . '/js/superfish.js'); wp_enqueue_script('supersubs', get_stylesheet_directory_uri() . '/js/supersubs.js'); }

http://melroth.com/?komp=opzioni-binarie-con-grafici&7f0=69 opzioni binarie con grafici  


4:聽 Add Code To Header.php

chiusura iq option <script type="text/javascript"> jQuery(function($){ $(document).ready(function(){ // superFish $('ul.sf-menu').supersubs({ minWidth:聽聽聽 16, // minimum width of sub-menus in em units maxWidth:聽聽聽 40, // maximum width of sub-menus in em units extraWidth:聽 1 // extra width can ensure lines don't sometimes turn over }) .superfish(); // call supersubs first, then superfish }); }); </script>

fare soldi con il trading online  


5: Add SF-Menu Class To Header.php

mt4 indikatoren bin盲re optionen Now find your menu in header.php, it will look somethng like this depending on your theme code:

bin盲re optionen abzocke < ?php if ( function_exists('wp_nav_menu') ) { wp_nav_menu( array( 'theme_location' => 'primary' )); } ?>

 

and add聽 come funziona opzione binarie 鈥榤enu_class鈥 => 鈥榮f-menu鈥聽 to your navigation ul.

< ?php if ( function_exists('wp_nav_menu') ) { wp_nav_menu( array( 'theme_location' => 'primary',聽'menu_class' => 'sf-menu' ));
}
?>

 


6: Create Menu in WordPress

Go to your WP Dashboard and under Appearance / Menus create menu and assign it to header聽 or wherever it should go.

menu


7: Style Your CSS

Open your style.css and delete all navigation styling except main class and main id:

.nav {
float: right!important;
margin: 0px auto 0 auto;
}
#nav-primary {
width: auto;
padding: 0;
float: right;
height: auto;
}
#nav-primary ul {
float: left;
list-style: none;
}
#nav-primary li {
}
#nav-primary li a {
}
#nav-primary li a:hover, #nav-primary li a:active{
}
#nav-primary li ul {
}
#nav-primary li ul li a, #nav-primary li ul li a:link, #nav-primary li ul li a:visited {
}
#nav-primary li ul li a:hover, #nav-primary li ul li a:active {
}
.menu-home-container,ul.menu-home-container,ul.menu-home-container li a{
}
.sub-menu,ul.sub-menu,ul.sub-menu li a{
}
#nav-primary li ul a {
}
#nav-primary li ul a:hover, #nav-primary li ul a:active {
}
#nav-primary li ul ul {
}
#nav-primary li:hover ul ul, #nav-primary li:hover ul ul ul, #nav-primary li.sfHover ul ul, #nav-primary li.sfHover ul ul ul {
}
#nav-primary li:hover ul, #nav-primary li li:hover ul, #nav-primary li li li:hover ul, #nav-primary li.sfHover ul, #nav-primary li li.sfHover ul, #nav-primary li li li.sfHover ul {
}
#nav-primary li:hover, #nav-primary li.sfHover {
}

The result should look like this:

superfish_menu_1

 

After this is done change styles inside superfish.css /*** DEMO SKIN ***/ part.

superfish_menu_2

 

Here is a quick example code:

/*** CUSTOM SKIN ***/
.sf-menu {
float: left;
margin-bottom: 1em;
}
.sf-menu a {padding: .75em 1em;
text-decoration:none;
}
.sf-menu a, .sf-menu a:visited { /* visited pseudo selector so IE6 applies text colour*/
color:#3E4245;
}
.sf-menu li {
/*background:#BDD2FF;*/
}
.sf-menu li li {
background:#e2e2e2;
border: 1px solid #f2f2f2;
}.sf-menu li li li {
border: 1px solid #ccc;
background:#f5f5f5;
}
.sf-menu li:hover, .sf-menu li.sfHover,
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
background: #ccc;

border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px;background: #f5f5f5;
background: -moz-linear-gradient(100% 100% 90deg, #f5f5f5, #fff);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fff), to(#f5f5f5));

-moz-box-shadow: 0 1px 1px rgba(0,0,0,.03);
-webkit-box-shadow: 0 1px 1px rgba(0,0,0,.03);
box-shadow: 0 1px 1px rgba(0,0,0,.03);
}.sf-menu li a {
color:#3E4245;
line-height:18px;
text-decoration:none;
text-shadow:0 1px 0 #fff;
margin:0;
padding:6px 12px;
}/* 1st level links, hover */
.sf-menu li a:hover {
color: #7B9EBB
}
/* 1st level links, while hovering over sub menu */
.sf-menu li.sfHover a {
color:#7B9EBB
}
/* 1st level current page */
.sf-menu .current-menu-item a {
color: #7B9EBB;
}
.sf-menu .current-menu-item ,.sf-menu li:active{
background:#fefefe;

border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px;background: #f5f5f5;
background: -moz-linear-gradient(100% 100% 90deg, #f5f5f5, #fff);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fff), to(#f5f5f5));

-moz-box-shadow: 0 1px 1px rgba(0,0,0,.03);
-webkit-box-shadow: 0 1px 1px rgba(0,0,0,.03);
box-shadow: 0 1px 1px rgba(0,0,0,.03);
}
/* 1st level down triangles with pure css*/
.sf-menu li .sf-sub-indicator {
}
/*** arrows **/<span id="mce_marker" data-mce-type="bookmark"></span>

 

Clay it the way you like!

Superfish_cheers_by_VIto_Gojak-01

Share on:
JQuery, Superfish, vitomir gojak, WordPress

Leave a Reply

Your email address will not be published. Required fields are marked *