Advanced search  

News:

CPG Release 1.6.26
Correct PHP8.2 issues with user and language managers.
Additional fixes for PHP 8.2
Correct PHP8 error with SMF 2.0 bridge.
Correct IPTC supplimental category parsing.
Download and info HERE

Pages: [1]   Go Down

Author Topic: Adding text to navigation buttons  (Read 11286 times)

0 Members and 1 Guest are viewing this topic.

Leonard Will

  • Coppermine novice
  • *
  • Offline Offline
  • Posts: 27
Adding text to navigation buttons
« on: July 05, 2017, 11:47:01 am »

In order to add text as well as icons to navigation buttons, I found that you can just insert the text before the final <a> in the relevant function in \js\displayimage.js. For example, I inserted the word "Slideshow" in the following:

Quote
function printSlideshowButton() {
    // insert slideshow button as defined in theme or create default button
    var btn = js_vars.buttons.slideshow_btn ? js_vars.buttons.slideshow_btn
        : '<a href="' + js_vars.buttons.slideshow_tgt + '" class="navmenu_pic" title="' + js_vars.buttons.slideshow_title + '" rel="nofollow"><img src="' + js_vars.buttons.loc + 'images/navbar/slideshow.png" border="0" align="middle" alt="' + js_vars.buttons.slideshow_title + '" />Slideshow</a>';
    $('#slideshow_button').append(btn);
}

I don't know whether .js files can be included in a custom theme, to avoid having to make the change in the core file.
Logged

Αndré

  • Administrator
  • Coppermine addict
  • *****
  • Country: de
  • Offline Offline
  • Gender: Male
  • Posts: 15764
Re: Adding text to navigation buttons
« Reply #1 on: July 06, 2017, 10:40:12 am »

It's already written in the code you provided ;)
Quote
    // insert slideshow button as defined in theme or create default button
    var btn = js_vars.buttons.slideshow_btn ? js_vars.buttons.slideshow_btn

So you'd need to insert something like that to your theme's theme.php file:
Code: [Select]
set_js_var('buttons.slideshow_btn', '<a href="' + js_vars.buttons.slideshow_tgt + '" class="navmenu_pic" title="' + js_vars.buttons.slideshow_title + '" rel="nofollow"><img src="' + js_vars.buttons.loc + 'images/navbar/slideshow.png" border="0" align="middle" alt="' + js_vars.buttons.slideshow_title + '" />Slideshow</a>');(not tested).
Logged

Leonard Will

  • Coppermine novice
  • *
  • Offline Offline
  • Posts: 27
Re: Adding text to navigation buttons
« Reply #2 on: July 10, 2017, 04:44:16 pm »

Thanks for the reply, André. I was not familiar enough with Javascript to recognize the significance of the "ternary operator" ? ... : in the code.  :(

I have tried pasting the code you suggested into my theme.php, changing the last word from "Slideshow" to "Zlideshow" so that I would know which version was being picked up, and it is not being recognized.  I tried pasting it at the start or at the end, just before the final "?>" - should it go somewhere else, or does it need any wrapper or additional code to set the variable js_vars.buttons.slideshow_btn ?

I tried removing the option code in displayimage.js, leaving just "var btn = js_vars.buttons.slideshow_btn;" and nothing was output, so I guess that the variable was not set.

My gallery is at www.enfieldsociety.org.uk/photographs/
Logged

Αndré

  • Administrator
  • Coppermine addict
  • *****
  • Country: de
  • Offline Offline
  • Gender: Male
  • Posts: 15764
Re: Adding text to navigation buttons
« Reply #3 on: July 10, 2017, 05:08:29 pm »

Copy the function theme_html_img_nav_menu from themes/sample/theme.php to your theme's theme.php file, if it doesn't exist.

Then either look for
Code: [Select]
$slideshow_btn = '';
or change the following code to your needs
Code: [Select]
    $js_buttons = array(
        'pic_info_title'  => $lang_img_nav_bar['pic_info_title'],
        'pic_info_btn'    => $pic_info_btn,
        'slideshow_tgt'   => $slideshow_tgt,
        'slideshow_title' => $lang_img_nav_bar['slideshow_title'],
        'slideshow_btn'   => $slideshow_btn,
        'loc' => $location,
    );
Logged

Leonard Will

  • Coppermine novice
  • *
  • Offline Offline
  • Posts: 27
Re: Re: Adding text to navigation buttons
« Reply #4 on: July 10, 2017, 10:22:16 pm »

Copy the function theme_html_img_nav_menu from themes/sample/theme.php to your theme's theme.php file, if it doesn't exist.

Then either look for
Code: [Select]
$slideshow_btn = '';

I have done this, and changed the line above to

Code: [Select]
$slideshow_btn = '<a href="' + js_vars.buttons.slideshow_tgt + '" class="navmenu_pic"
title="' + js_vars.buttons.slideshow_title + '" rel="nofollow">
<img src="' + js_vars.buttons.loc + 'images/navbar/slideshow.png"
border="0" align="middle" alt="' + js_vars.buttons.slideshow_title + '" />ZZSlideshow</a>';

It doesn't work, though, to override the button defined in displayimage.js. I wonder whether that is because the js_vars are not defined until a few lines later. If I replace these variables in the above code with literal text, such as an arbitrary URL instead of ...slideshow_tgt, removing ...loc and inserting a literal title, the changed button is displayed, but of course does not start the slideshow.

Incidentally, I can't see where the class "navmenu_pic" is defined - I don't know whether that has any effect.
Logged

Αndré

  • Administrator
  • Coppermine addict
  • *****
  • Country: de
  • Offline Offline
  • Gender: Male
  • Posts: 15764
Re: Adding text to navigation buttons
« Reply #5 on: July 10, 2017, 10:34:44 pm »

You need to replace the JS vars with the corresponding PHP variables (have a look at the second code I posted) . I'm currently on a mobile phone, so I cannot create the code for you.
Logged

Leonard Will

  • Coppermine novice
  • *
  • Offline Offline
  • Posts: 27
Re: Adding text to navigation buttons
« Reply #6 on: July 11, 2017, 12:21:58 am »

Many thanks for your prompt replies. I have now used the following code, which may be more complicated than necessary but which works.

Code: [Select]
$slideshow_btn = "<a href={$slideshow_tgt} class=\"navmenu_pic\" title=\"{$lang_img_nav_bar[slideshow_title]}\" rel=\"nofollow\">
<img src=\"images/navbar/slideshow.png\" border=\"0\" align=\"middle\" alt=\"{$lang_img_nav_bar[slideshow_title]}\" />Slideshow</a>";

I'll try to do the same for pic_info_btn tomorrow.
Logged

Leonard Will

  • Coppermine novice
  • *
  • Offline Offline
  • Posts: 27
Re: Adding text to navigation buttons
« Reply #7 on: July 11, 2017, 05:14:16 pm »

In case anyone else wants to add text to buttons within a theme, I found that for the "picture information" button the following code works when added to theme.php as indicated by André:

Code: [Select]
// if set, this will override the default pic_info button to be inserted by displayimage.js
$pic_info_btn = "<a href=\"javascript:;\" class=\"navmenu_pic\" onclick=\"blocking('picinfo','yes','block'); return false;\"
title=\"{$lang_img_nav_bar[pic_info_title]}\" rel=\"nofollow\"><img src=\"images/navbar/info.png\" border=\"0\"
align=\"middle\" alt=\"{$lang_img_nav_bar[pic_info_title]}\" />Picture information</a>";

I hope that CPG 1.6 will provide a simpler way of doing this!
Logged
Pages: [1]   Go Up
 

Page created in 0.023 seconds with 20 queries.