Ask your WordPress questions! Pay money and get answers fast! Comodo Trusted Site Seal
Official PayPal Seal

Regular expressions: convert to WordPress

  • SOLVED

I need to convert a standard WordPress menu into a <select></select> combobox using a series of preg_replace statements or a similar PHP-based solution. This is what I have:

<ul id="nav" class="sf-menu">
<li><a href="/">Home</a></li>
<li class="page_item page-item-55"><a href="http://www.domain.com/some-link-1" title="About David"><span>About David</span></a></li>
<li class="page_item page-item-69"><a href="http://www.domain.com/some-link-2" title="Workshops &amp; Events"><span>Workshops &amp; Events</span></a></li>
<li class="page_item page-item-156"><a href="http://www.domain.com/some-link-3" title="Articles"><span>Articles</span></a></li>
<li class="page_item page-item-61"><a href="http://www.domain.com/some-link-4" title="David&#8217;s Blog"><span>David&#8217;s Blog</span></a></li>
<li class="page_item page-item-82"><a href="http://www.domain.com/some-link-5" title="Testimonials"><span>Testimonials</span></a></li>
<li class="page_item page-item-147"><a href="#" title="Resources"><span>Resources</span></a>
<ul>
<li class="page_item page-item-150"><a href="http://www.domain.com/some-link-7" title="FAQs"><span>FAQs</span></a></li>
<li class="page_item page-item-152"><a href="http://www.domain.com/some-link-8" title="Links"><span>Links</span></a></li>
</ul>
</li>
<li class="page_item page-item-89"><a href="http://www.domain.com/some-link-9" title="Contact Me"><span>Contact Me</span></a></li>
</ul>


And this is what I want to convert it to:

<select id="nav" class="sf-menu">
<option><a value="/">Home</option>
<option class="page_item page-item-55" value="http://www.domain.com/some-link-1"><span>About David</span></option>
<option class="page_item page-item-69" value="http://www.domain.com/some-link-2"><span>Workshops &amp; Events</span></option>
<option class="page_item page-item-156" value="http://www.domain.com/some-link-3"><span>Articles</span></option>
<option class="page_item page-item-61" value="http://www.domain.com/some-link-4"><span>David&#8217;s Blog</span></option>
<option class="page_item page-item-82" value="http://www.domain.com/some-link-5"><span>Testimonials</span></option>
<option class="page_item page-item-147" value="#"><span>Resources</span></option>
<option class="page_item page-item-150" value="http://www.domain.com/some-link-7"><span class="indent">FAQs</span></option>
<option class="page_item page-item-152" value="http://www.domain.com/some-link-8"><span class="indent">Links</span></option>
<option class="page_item page-item-89" value="http://www.domain.com/some-link-9"><span>Contact Me</span></option>
</select>


Please note that one of the menu items has a submenu under it and it results in <option> items that contain <span class="indent">. Again, if you have other ideas on how to accomplish this, I'm open to them as long as I can use PHP to do it and it will work within WordPress.

Thanks!

Answers (3)

2011-03-21

Utkarsh Kukreti answers:

Try this: (replace 'primary' with your nav menus slug, or ID)

$nav_menu_items = wp_get_nav_menu_items('primary');

echo '<select id="nav" class="sf-menu">';
foreach($nav_menu_items as $nav_menu_item) {
$class = "page_item page-item-{$nav_menu_item->ID}";
if($nav_menu_item->menu_item_parent == '0') {
$content = "<span>{$nav_menu_item->title}</span>";
} else {
$content = "<span class='indent'>{$nav_menu_item->title}</span>";
}
$value = $nav_menu_item->url;

echo "<option class='$class' value='$value'>$content</option>";
}
echo '</select>';

2011-03-21

Maor Barazany answers:

Why not building a custom walker nav instead of preg replacing? I think it would be better.

Here are two resources for building custom walker -
[[LINK href="http://www.kriesi.at/archives/improve-your-wordpress-navigation-menu-output"]]http://www.kriesi.at/archives/improve-your-wordpress-navigation-menu-output[[/LINK]]

[[LINK href="http://erikshosting.com/wordpress-tips-code/building-a-wordpress-walker-creating-custom-dynamic-menu-outputs/"]]http://erikshosting.com/wordpress-tips-code/building-a-wordpress-walker-creating-custom-dynamic-menu-outputs/[[/LINK]]

2011-03-22

nabeel answers:

Run this code to see the result, then replace $one as you need it to be

<?php
$one = '<ul id="nav" class="sf-menu">
<li><a href="/">Home</a></li>
<li class="page_item page-item-55"><a href="http://www.domain.com/some-link-1" title="About David"><span>About David</span></a></li>
<li class="page_item page-item-69"><a href="http://www.domain.com/some-link-2" title="Workshops &amp; Events"><span>Workshops &amp; Events</span></a></li>
<li class="page_item page-item-156"><a href="http://www.domain.com/some-link-3" title="Articles"><span>Articles</span></a></li>
<li class="page_item page-item-61"><a href="http://www.domain.com/some-link-4" title="David&#8217;s Blog"><span>David&#8217;s Blog</span></a></li>
<li class="page_item page-item-82"><a href="http://www.domain.com/some-link-5" title="Testimonials"><span>Testimonials</span></a></li>
<li class="page_item page-item-147" style="padding: 20px" ><a href="#" title="Resources"><span>Resources</span></a>
<ul>
<li class="page_item page-item-150"><a href="http://www.domain.com/some-link-7" title="FAQs"><span style="padding: 10px;">FAQs</span></a></li>
<li class="page_item page-item-152"><a href="http://www.domain.com/some-link-8" title="Links"><span>Links</span></a></li>
</ul>
</li>
<li class="page_item page-item-89"><a href="http://www.domain.com/some-link-9" title="Contact Me"><span>Contact Me</span></a></li>
</ul>';

$regcode = "/(<li\sclass[^$]*?)<ul>/";
$one = preg_replace($regcode,"$1</li><optgroup>",$one);

$regcode = "/<\/ul>[^$]*?<\/li>/";
$one = preg_replace($regcode,"</optgroup>",$one);

$one = str_replace('<ul ','<select ',$one);
$one = str_replace('<li','<option',$one);
$one = str_replace('/li','/option',$one);
$one = str_replace('><a href',' value',$one);
$one = str_replace('</ul','</select',$one);


print_r($one);

?>