{"id":5580,"date":"2015-08-07T09:13:52","date_gmt":"2015-08-07T08:13:52","guid":{"rendered":"https:\/\/ro.wordpress.org\/support\/topic\/modificare-meniu-in-php\/"},"modified":"2016-08-05T22:36:12","modified_gmt":"2016-08-05T22:36:12","slug":"modificare-meniu-in-php","status":"publish","type":"topic","link":"https:\/\/ro.wordpress.org\/support\/topic\/modificare-meniu-in-php\/","title":{"rendered":"Modificare meniu in php"},"content":{"rendered":"

Salutare,
\nAm sa intru direct in subiect. Doresc sa modific meniul generat de codul php<\/code> existent, plecand de la urmatoarea structura html<\/code>\/css<\/code>\/js<\/code> prezentata in codepen: <\/p>\n

Home \/ Portfolio \/ About<\/em><\/a> si mergand pe Portfolio<\/em>, alta pagina avand Home \/ Portfolio projects<\/a><\/em>. <\/p>\n

Am procedat astfel: am inregistrat in script-calls.php<\/code>, mynewmenu.js<\/code> ce contine urmatorul cod:<\/p>\n

js<\/code>:<\/p>\n

\/\/ mynewmenu implementation\n    jQuery(function($){\n    \tvar height, index, prevIndex\n\n    \t$('nav ul li').mouseover(function(e){\n    \t\t\/\/Set the aesthetics (similar to :hover)\n    \t\t$('nav ul li').removeClass('hovered');\n    \t\t$(this).addClass('hovered');\n\n    \t\t\/\/Gets relevant data required for scrolling of menuRight\n    \t\theight = $("#menuRight").css("height").replace('px','');\n    \t\tindex = $(this).index();\n\n    \t\t\/\/If the category button (from the navlist) has changed\n    \t\tif (index != prevIndex){\n    \t\t\t$("#menuRight").stop();\n\n    \t\t\t$("#menuRight").animate({"scrollTop":height*index}, 800, 'easeOutBounce'); \/\/This requires jQuery UI for easing options.\n    \t\t\tprevIndex = index;\n    \t\t}\n    \t});\n    });<\/code><\/pre>\n
Am creat structura meniului despre care vorbeam mai sus (in functie de pagina avem un anumit meniu asa cum se vede aici<\/a>) si am identificat secventa php<\/code> ce genereaza meniul in header.php<\/code>:<\/p>\n
<!-- Start Header -->\n\t     ...\n\t\t<div class="myrow max_width ">\n\t\t\t<div class="small-5 <?php if ($header_style == 'style2') { echo 'medium-8'; } else { echo 'medium-4';} ?> columns menu-holder">\n\t\t\t\t<?php $full_menu_true = ($menu_mobile_toggle_view == 'style2' && $header_style == 'style2');?>\n\t\t\t\t<?php if ($full_menu_true) { ?>\n\t\t\t\t\t<nav id="full-menu" role="navigation">\n\t\t\t\t\t\t<?php if ($page_menu) { ?>\n\t\t\t\t\t\t\t<?php wp_nav_menu( array( 'menu' => $page_menu, 'depth' => 2, 'container' => false, 'menu_class' => 'full-menu', 'walker' => new thb_mobileDropdown  ) ); ?>\n\t\t\t\t\t\t<?php } else  if(has_nav_menu('nav-menu')) { ?>\n\t\t\t\t\t\t  <?php wp_nav_menu( array( 'theme_location' => 'nav-menu', 'depth' => 2, 'container' => false, 'menu_class' => 'full-menu', 'walker' => new thb_mobileDropdown ) ); ?>\n\t\t\t\t\t\t<?php } else { ?>\n\t\t\t\t\t\t\t<ul class="full-menu">\n\n<li><a>">Please assign a menu from Appearance -> Menus<\/a><\/li>\n\t\t\t\t\t\t<?php } ?>\n\t\t\t\t\t<\/nav>\n\t\t\t\t<?php } ?>\n\t\t\t\t<?php if ($header_search != 'off') { do_action( 'thb_quick_search' ); } ?>\n\t\t\t\t<?php if ($header_cart != 'off') { do_action( 'thb_quick_cart' ); } ?>\n\t\t\t\t<a href="#"> always<?php } ?>">\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<span><\/span><span><\/span><span><\/span>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/a>\n\t\t\t<\/div>\n\t\t<\/div>\t\n\n\t<\/header>\n\t<!-- End Header --><\/code><\/pre>\n
Acestea fiind spuse, intrebarea mea este legata de cum anume as putea  implementa in header.php<\/code>, urmatoarele secvente de html<\/code> care genereaza rolloverurile de imagini atasate butoanelor de meniu (asa cum v-am aratat in codepenurile de mai sus) avand in vedere faptul ca discutam despre doua sectiuni <div> diferite dupa cum urmeaza. Home \/ Portfolio \/ About:<\/p>\n
<nav>\n\n<ul>\n       ...\n      <\/ul>\n        <div id='menuRight'>\n           <div>\n               Home\n               <img src='http:\/\/images5.fanpop.com\/image\/photos\/31100000\/random-space-space-31155586-598-398.jpg'>\n              <\/img>\n           <\/div>\n          <div>\n              Portfolio\n              <img src='http:\/\/www.keenthemes.com\/preview\/metronic\/theme\/assets\/global\/plugins\/jcrop\/demos\/demo_files\/image1.jpg'>\n              <\/img>\n          <\/div>\n          <div>\n              About\n              <img src='http:\/\/images5.fanpop.com\/image\/photos\/31100000\/random-space-space-31155586-598-398.jpg'>\n              <\/img>\n          <\/div>\n        <\/div>\n    <\/nav><\/code><\/pre>\n
iar pentru meniu 2, Home \/ Portfolio projects:<\/p>\n
<nav>\n\n<ul>\n        ...\n      <\/ul>\n        <div id='menuRight'>\n           <div>\n               Home\n               <img src='http:\/\/images5.fanpop.com\/image\/photos\/31100000\/random-space-space-31155586-598-398.jpg'>\n              <\/img>\n           <\/div>\n          <div>\n              Fiva\n              <img src='http:\/\/www.keenthemes.com\/preview\/metronic\/theme\/assets\/global\/plugins\/jcrop\/demos\/demo_files\/image1.jpg'>\n              <\/img>\n          <\/div>\n          <div>\n              Caterham\n              <img src='http:\/\/images5.fanpop.com\/image\/photos\/31100000\/random-space-space-31155586-598-398.jpg'>\n              <\/img>\n          <\/div>\n          <div>\n              Mobile\n              <img src='http:\/\/www.keenthemes.com\/preview\/metronic\/theme\/assets\/global\/plugins\/jcrop\/demos\/demo_files\/image1.jpg'>\n              <\/img>\n          <\/div>\n        <\/div>\n    <\/nav><\/code><\/pre>\n
Deocamdata nu discutam despre css<\/code>.
\nVreo parere? multam.<\/p>\n","protected":false},"template":"","class_list":["post-5580","topic","type-topic","status-publish","hentry","topic-tag-html","topic-tag-php"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/ro.wordpress.org\/support\/wp-json\/wp\/v2\/topic\/5580","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ro.wordpress.org\/support\/wp-json\/wp\/v2\/topic"}],"about":[{"href":"https:\/\/ro.wordpress.org\/support\/wp-json\/wp\/v2\/types\/topic"}],"version-history":[{"count":0,"href":"https:\/\/ro.wordpress.org\/support\/wp-json\/wp\/v2\/topic\/5580\/revisions"}],"wp:attachment":[{"href":"https:\/\/ro.wordpress.org\/support\/wp-json\/wp\/v2\/media?parent=5580"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}