Converting Text Link to Image

[James Gryphon]

I realize that image buttons aren't in vogue these days, but for various reasons, I've turned towards using them for my take on a retro YaBB SE theme.

Things have gone surprisingly well so far, but I've run into a problem, as usual over a stupid little detail. I decided to try to convert the "Go Down"/"Go Up" links on the message index back to images. I thought I'd adapt the "New" buttons, since they're already on the same page. To make a long story short, there's always something unexpected or another every time I run it.

Here's what the segment looks like originally:

Code Select Expand

echo '
<div id="modbuttons_top" class="modbuttons clearfix margintop">
<div class="floatleft middletext">', $txt['pages'], ': ', $context['page_index'], !empty($modSettings['topbottomEnable']) ? $context['menu_separator'] . '&nbsp;&nbsp;<a href="#bot"><strong>' . $txt['go_down'] . '</strong></a>' : '', '</div>
', template_button_strip($normal_buttons, 'bottom'), '
</div>';
And revised/messed up:

Code Select Expand

echo '
<div id="modbuttons_top" class="modbuttons clearfix margintop">
<div class="floatleft middletext">', $txt['pages'], ': ', $context['page_index'], !empty($modSettings['topbottomEnable']) ? $context['menu_separator'] . '&nbsp;&nbsp;<a href="#bot"><img src="', $settings['lang_images_url'], '/go_down.gif" alt="', $txt['new'], '" /></a>' : '', '</div>
', template_button_strip($normal_buttons, 'bottom'), '
</div>';

It seems like this ought to be easy, but the punctuation soup down at  the bottom has me completely discombobulated.

If anybody has any quick ideas on how to get this working, I'd very much appreciate it.

[richardwbb]

I can't tell you what exactly you have need for, but I recommend to open your index.template.php, and do a find for 'logo'.

example;

Code Select Expand


<a href="', $scripturl, '">', empty($context['header_logo_url_html_safe']) ? '<img src="'. $settings['images_url']. '/theme/logo.png" alt="' . $context['forum_name'] . '" title="' . $context['forum_name'] . '" />' : '<img src="' . $context['header_logo_url_html_safe'] . '" alt="' . $context['forum_name'] . '" title="' . $context['forum_name'] . '" />', '</a>


And, change your template.css; find the id or class [id="modbuttons_top" class="modbuttons clearfix margintop" and put a 'display: none;' in there.

That way you can copy that piece of php code, change just an id or class to, for example; 'modbuttons_top-tst', create this one in template.css, and, remove the 'display: none;' [for the 'none' property, see; http://www.w3schools.com/css/css_display_visibility.asp] from there.

That way you will have a working code to look at, above or below the code you are modifying.