Edit markup

Resolved davidcasey
(@davidcasey)

10 years, 4 months ago
I’d like to edit the markup, is there a way to do this or a feature that could be added through a filter? We don’t use the Font Awesome style, choosing rather something like this:
```
<a href="http://twitter.com" class="external-link" title="Twitter">Twitter</a>
```
Instead of:
```
<a href="http://twitter.com" class="external-link">Twitter</a>
```
I am using this:
```
// remove fontawesome, we use our own icon font
function storm_dequeue_fontawesome(){
 wp_dequeue_style( 'fontawesome' );
 wp_dequeue_style( 'fontawesome-ie' );
}
add_action( 'wp_enqueue_scripts', 'storm_dequeue_fontawesome', 20 );
```
However, I would also like to remove the styles that get output through wp_print_scripts() As I build my own CSS and fonts.

I’d prefer to do this with filters/actions vs extending the class and overriding the functions in question.

Thank you for an excellent plugin!

http://wordpress.org/plugins/menu-social-icons/

Viewing 11 replies - 1 through 11 (of 11 total)

Plugin Author Paul Clark
(@pdclark)

10 years, 4 months ago

I suppose you *could* replace the entire wp_nav_menu_objects filter from the current plugin, but you’re right that adding a filter for just the HTML output would be cleaner and easier.

I’m in and out this weekend, but I’ll see about releasing a revision with the filter shortly.
Plugin Author Paul Clark
(@pdclark)

10 years, 4 months ago
PS: If you’re interesting in looking at it in the meantime, the lines I’ll be adjusting for filers will be:
```
// msi-frontend.php line 210
return "";
```
and maybe:
```
// msi-frontend.php lines 231-233
if ( $this->hide_text ) {
 $item->title = '' . $item->title . '';
}
```
Thread Starter davidcasey
(@davidcasey)

10 years, 4 months ago

Thank you so much, Paul. I do appreciate your work.

Filters for both those items would be perfect!

Plugin Author Paul Clark
(@pdclark)

10 years, 4 months ago

I’ve released version 1.3.6 for you with the ability to override all HTML and CSS output.

Just copy the msi-templates directory to your theme, then edit the HTML in those files within your theme directory.

Hope that helps! Please take the time to submit a short review. It helps a lot!

Thread Starter davidcasey
(@davidcasey)

10 years, 4 months ago

Hey, thanks. That works, somewhat. I’d also like to be able to edit the anchor tag.

I don’t mean to be inconsiderate, but now you are forcing me to put that folder in the root of my themes folder … which I do not like. I keep my theme files very organized, and this is no bueno.

Any way I could get you to add a filter as well so I can override without using the templates?

Thank you!
Plugin Author Paul Clark
(@pdclark)

10 years, 4 months ago
Version 1.3.7 has been revised to use filters for the HTML output. See storm_social_icons_icon_html, storm_social_icons_title_html, and wp_nav_menu_objects documented in the plugin readme.

Link output is controlled by the wp_nav_menu_objects filter. It’s a WordPress core filter — the same one Menu Social Icons uses to work. I’ve included how to edit link classes or add HTML inside the link in the example, but you can use:
```
echo '<pre>';
var_dump( $item );
echo '</pre>';
```
…to view all available settings for each menu item. (But not on a live site! It will output code!)

You might also find the WordPress core filters wp_nav_menu_items and wp_nav_menu_{$menu->slug}_items useful. They’re raw HTML, which is more difficult to reliably modify, but they do have their uses. You can find them around wp-includes/nav-menu-template.php:347
Plugin Author Paul Clark
(@pdclark)

10 years, 4 months ago

Also, please take the time to submit a short review!
Thread Starter davidcasey
(@davidcasey)

10 years, 4 months ago
Getting an error:
Notice: Undefined variable: title in /wp-content/plugins/menu-social-icons/classes/msi-frontend.php on line 234

If you add this line directly above, it will fix the issue.
```
$title = $item->title;
```
For wp_print_scripts():
```
public function wp_print_scripts() {
		$html = '
		<style>
			/* Accessible for screen readers but hidden from view */
			.fa-hidden { position:absolute; left:-10000px; top:auto; width:1px; height:1px; overflow:hidden; }
			.rtl .fa-hidden { left:10000px; }
			.fa-showtext { margin-right: 5px; }
		</style>';
		echo apply_filters( 'storm_social_icons_stylesheet', $html );
	}
```
Then we can do this:
```
// remove header style
function storm_social_icons_stylesheet( $html ) {
	return '';
}
add_filter( 'storm_social_icons_stylesheet', 'storm_social_icons_stylesheet' );
```
Thread Starter davidcasey
(@davidcasey)

10 years, 4 months ago

The other filter hooks are working perfectly! Thank you!
Plugin Author Paul Clark
(@pdclark)

10 years, 4 months ago
Notice fixed in 1.3.8. It should have been $item->title. Thanks.

A filter isn’t needed to disable stylesheet output — instead, you would remove the hook:
```
add_action( 'template_redirect', 'remove_msi_stylesheet', 6 );
function remove_msi_stylesheet() {
	remove_action( 'wp_print_scripts', array( MSI_Frontend::get_instance(), 'wp_print_scripts' ) );
}
```
Thanks for taking the time to submit a review!
Thread Starter davidcasey
(@davidcasey)

10 years, 4 months ago

Ah ha. I have learned something about OOP! Thank you Paul.

Viewing 11 replies - 1 through 11 (of 11 total)

The topic ‘Edit markup’ is closed to new replies.