replace image with text in mobile device

Hi pikaya,

I have the same issue – I have a partial solution.

if you use this code it will span the navigation label under the image and if you check your menu on a mobile device text will show up (you do need to have a responsive theme for this to happen)

function md_nmi_custom_content( $content, $item_id, $original_content ) {
  $content = $content . '<span class="page-title">' . $original_content . '</span>';

  return $content;
}
add_filter( 'nmi_menu_item_content', 'md_nmi_custom_content', 10, 3 );

Milan, the plugin author, explained that here

however, I don’t know how to just include the page-title and not show up (keeping it in the responsive menu), or make the page-title display ove the image at the base of it

maybe we can fix it togheter

cheers ??

??

I modified a little bit of code to Milan’s

function md_nmi_custom_content( $content, $item_id, $original_content ) {
  $content = $content . '<span class="page-title" style="display:none">' . $original_content . '</span>';

  return $content;
}
add_filter( 'nmi_menu_item_content', 'md_nmi_custom_content', 10, 3 );

notice the style=”display:none” inclusion that hides the page-title class when showing the menu, but keeps it in the responsive menu

Great many many thanks for your help ??

Hi! Can you tell me where I should put this code? I have a responsive theme and this plugin but I’m a n00b and don’t know where to paste your code to make the pics turn to text when being viewed on mobile. Thanks!

hi,

the code is to be put in the <functions.php> file

preferably you should use a child theme because if you do a theme update you will lose all your changes

Thank you for your reply. I built a child theme and added this to my functions.php file but it does not appear to work. Perhaps my theme does not allow this code? I appreciate your help anyway.

Also, when I cut out the child theme and just paste your code directly into the functions.php of the PARENT theme, it also doesn’t work. So I guess this theme I am using just won’t allow this particular function. If you can think of any other ways to achieve the goal of getting text to show on mobile browsers instead of images I would be most grateful!

Hi,

it’s pretty weird actually that it does not work – maybe it’s a bracket thing (I’ve put the content of the functions file bellow for you to compare it)

I don’t think there is another way to display the responsive menu item – the responsive menu is blank where images are used because the plugin replaces the navigation label with the image.

<?php
/*
Functions file with additional modifications for the child-theme
*/
// Function that spans the navigation label and does not show it; used to display the responsive the menu
function md_nmi_custom_content( $content, $item_id, $original_content ) {
  $content = $content . '<span class="page-title" style="display:none">' . $original_content . '</span>';

  return $content;
}
add_filter( 'nmi_menu_item_content', 'md_nmi_custom_content', 10, 3 );

?>

Is there a way to output the title outside the <a href> and into a separate one?? I can output it out properly but I cant get thehref=" " to populate around the title.

Thanks a lot