I am looking to get a custom WordPress nav output but I'm struggling to understand where to go with it.
At the moment, the default output for WordPress is this:
<ul>
<li>Link</li>
<li>Link
<ul><li>Link</li></ul>
</li>
</ul>
But what I need to output is the following:
<ul>
<li>Link</li>
<li>Link
<ul><div><span></span><li>Link</li><span></span></div></ul>
</li>
</ul>
Now I know there is the $before and $after in WordPress but unfortunately if you use this it adds it to every link rather than just the child li's that I want it to add them to.
I understand this would be done with using the custom walker method but to say I'm confused is an understatement! Can anyone point me in the right direction?
To modify the output HTML of the Wordpress menu you could use a walker script.
I'm not able to explain this in a simple way myself, but there are good tutorials out there.
As far as I know the default script that Wordpress uses looks like this, and you may with some reading and coding skills be able to create the walker you need from modifying this one with your preferred tags.
Related
is it possible to assign a CSS class to advanced custom fields menu-item? I managed to display the selected value front end under the menu item. ACF menu-item tutorial shows how to assign font awesome and I get that but how can I get the color in there? Hope someone gets what I mean. Just tell me is it possible?
I think you have to inline the styles. For example, like this:
<ul class="main-menu">
<li>Menu1</li>
</ul>
Hope this helps :)
I've tried to google and read everywhere including here but no comprehensive tutorial can be found about this.
I want to totally change my topbar to something like this
<ul class="nav navbar-nav navbar-right">
<li>
Friends
</li>
<li>
Inbox
</li>
<li>
Dashboard
</li>
<li>
Settings
</li>
<li>
Logout
</li>
<li>
Announcements
</li>
</ul>
I can basically 'hard-code' this in topbar.php but i'm afraid I may not get the links right. Any best practices suggestions out there for this noob?
Elgg is designed to be plugin-centric, so by default it's expected that a lot of plugins may want to tap to main menu. There are three paths to follow:
Use tool in admin panel: Configure -> Appearance -> Menu Items
Unregister unnecessary menu items with elgg_unregister_menu_item and than rearrange them through plugin hook.
Downside of that is that adding new plugins may add unexpected menu items, but pro is that you may easily redistribute your code without worrying about synchronizing settings set via admin panel.
If you want to take control over whole menu rendering process, you'll want to override view navigation/menu/site and use any markup you desire. Links should be absolute. Use elgg_get_site_url() as the base.
I am using the tinyMCE in wordpress and I would like to alter the numbered list html so that when the editors create the lists using the button in between each li, a span is also added.
Current
<ol>
<li>this</li>
<li>is</li>
<li>current</li>
</ol>
Required
<ol>
<li><span class="test">this</span></li>
<li><span class="test">is </span></li>
<li><span class="test">what i want </span></li>
</ol>
my preference is to make the span the default when clicking on numlist button, but if it is easy to make a custom button to achieve this that advice would be very welcome too.
Many thanks in advance.
AFAIK, this is not possible out of the box.
In case anyone else is interested I did achieve the end out come but not through modifying the tinymce editor as the tinymce custom button route is not one i have time to pursue.
So instead I manipulated the 'content' on its way out of the db and did some simple regex preg__replace and str_replace work to end up with what i what i needed.
so the content manager now just creates an unordered list and adds numbers themselves at the start. we then loop through and adds in the span and p tags around the content and number. which then means the content can be styled beautifully! not an ideal solution but it works for now.
example $content = "1.Help me do this"
$content = str_replace("<li>","<li><p>",$content);
$content = str_replace("</li>","</p></li>",$content);
$pattern = "/(<p>?)+([0-9]{1,}\.?)/";
echo preg_replace($pattern,"<span>$2</span> $1",$content);
I am looking to create a custom button on the TinyMCE toolbar that wraps the currently selected content in a div with a class. I am using drupal 6.19 with wysiwyg-dev and TinyMCE 3.3.9.2.
Sample text:
<h3>Heading</h3>
<p>Sample text</p>
<ul>
<li>item 1</li>
<li>item 2</li>
</ul>
<p>more text</p>
Sample text that has been highlighted and had the 'button' pressed:
<div class="note">
<h3>Heading</h3>
<p>Sample text</p>
<ul>
<li>item 1</li>
<li>item 2</li>
</ul>
<p>more text</p>
</div>
I have read through a few forums on the internet, and have found people that have come close to solving this. Some use a custom TinyMCE plugin as in this guy http://forum.cmsmadesimple.org/index.php?topic=44093.0
Some say that the new TinyMCE version 3.3 now has the ability to do this through the 'formats' variable on when you initialise TinyMCE - http://tinymce.moxiecode.com/punbb/viewtopic.php?pid=73468
My question is - what is the best way to accomplish this using drupal? I am yet to get any of the above working
UPDATE
Have solved the issue now, Jeremy was right below, and I knew his answer was technically the correct answer, I was mainly asking if anyone else had done similiar work to this and had already created a module etc.
Anyway, in case anyone else comes across this problem, here are the files:
drupal_module_wysiwyg_wrapped_div_1.0.zip
tinymce_plugin_wrapped_div_1.0.zip
Let me know if you find these files useful ;)
Thanks
Sean
I'm assuming here that you have the button working and are trying to get it to work through Drupal.
If not, that is your first step. Split the problem into an implementation problem and an integration problem.
Once you have that working in a stand alone situation you can then create a module to implement it with Drupal.
You will need to create a module which implements hook_wysiwyg_plugin() to create the button as an option in the wysiwyg settings page.
Have a look at the IMCE wysiwyg bridge module, it implements a button on tinymce through Drupal.
Not sure about previous versions but with D7 (and up-to-date) wysiwyg + tinymce (imce wysiwyg bridge might also be necessary ...this is quite easy...
Once tinymce wysiwyg is working and all...
Select the text format you want to add the button to from admin/config/content/wysiwyg and then under the "Buttons" area check the box for "Styles"
scroll down to the "CSS" area and enter the classes you want to be able to use from the wysiwyg editor
then go put the styles for the classes you want to use in your style sheet
That's it. No custom modules necessary.
i want to add id tags to primary links menu..
it should look something like this:
<li><a id="home" href="#">Home</a></li>
<li><a id="about" href="#">About</a></li>
<li><a id="contact" href="#">Contact</a></li>
currently, it's just
<li>Home</li>
<li>About</li>
<li>Contact</li>
to change the address to "#" is it ok to use url aliases?
I just want to add attributes to l() when it creates the primary menu, thatz it in a nutshell..
any suggestions?
should i edit any file or create new function to do this job?
I'm using zen theme(just for an info)
many thanks..
It seems like you want to alter the links, so you can add some js tabs. If that is the case:
You shouldn't alter the href value of the links, since it will just break your navigation for those that doesn't use javascript.
If your aim is to add the id's to use them for js, your best option would be to add them using js.
In Drupal, there are some different ways to alter the output of the primary menu.
You can alter the drupal output for menus using theme_menu_item_link, this wont help much though, since, that function is used for all menu items.
Alternative you can handle creating the primary menu yourself in your template.php, but this is probably not worth the bother in this case.
Have you looked at using the Menu Class module? You can create menu class sets and then assign them to each individual menu items.
I use the Menu attributes module. Works great!