Newbie Needs Help with Buttons

[revo70]

can someone help out a newbie?

I added the Blue Web 2 buttons for default vB skin buttons, but the background text still shows (for example, 'ply' still shows underneath the Reply button.

Here's the code from that section, maybe you can tell me which one to delete? Thanks in advance.

<a id="qr_{vb:raw post.postid}" class='quickreply' href="{vb:raw post.replylink}" rel="nofollow"><img id="replyimg_{vb:raw post.postid}" src="images/buttons/quickreply.gif" alt="{vb:rawphrase quick_reply_to_this_message}" /> {vb:rawphrase reply}</a>

[Tasking Mickey]

can someone help out a newbie?

I added the Blue Web 2 buttons for default vB skin buttons, but the background text still shows (for example, 'ply' still shows underneath the Reply button.

Here's the code from that section, maybe you can tell me which one to delete? Thanks in advance.

<a id="qr_{vb:raw post.postid}" class='quickreply' href="{vb:raw post.replylink}" rel="nofollow"><img id="replyimg_{vb:raw post.postid}" src="images/buttons/quickreply.gif" alt="{vb:rawphrase quick_reply_to_this_message}" /> {vb:rawphrase reply}</a>
Uhh, let's see.

This is your code:
<a id="qr_{vb:raw post.postid}" class='quickreply' href="{vb:raw post.replylink}" rel="nofollow"><img id="replyimg_{vb:raw post.postid}" src="images/buttons/quickreply.gif" alt="{vb:rawphrase quick_reply_to_this_message}" /> {vb:rawphrase reply}</a>

Try this,

<a id="qr_{vb:raw post.postid}" class='quickreply' href="{vb:raw post.replylink}" rel="nofollow"><img id="replyimg_{vb:raw post.postid}" src="images/buttons/quickreply.gif" alt="{vb:rawphrase quick_reply_to_this_message}" /> </a>

[Lynne]

Try removing this from right before the </a> - {vb:rawphrase reply}

[revo70]

I really screwed things up. By adding new buttons they just either end up on top of each other or don't show up at all; or if I revert back (below), the Edit Post/Reply/Quote buttons seems to have disappeared.

Here's my code:
<vb:if condition="$post['editlink']">
<a class="editpost" href="{vb:raw post.editlink}" name="vB::QuickEdit::{vb:raw post.postid}"><img src="{vb:raw vboptions.cleargifurl}" id="editimg_{vb:raw post.postid}" alt="{vb:rawphrase edit_delete_message}" /> {vb:rawphrase edit_post}</a>
<span class="seperator">&nbsp;</span>
</vb:if>
<vb:if condition="$show['quickreply'] AND !$show['threadedmode']">
<a id="qr_{vb:raw post.postid}" class='quickreply' href="{vb:raw post.replylink}" rel="nofollow"><img id="replyimg_{vb:raw post.postid}" src="{vb:raw vboptions.cleargifurl}" alt="{vb:rawphrase quick_reply_to_this_message}" /> {vb:rawphrase reply}</a>
<span class="seperator">&nbsp;</span>
</vb:if>
<vb:if condition="$post['replylink']">
<a id="qrwq_{vb:raw post.postid}" class="newreply" href="{vb:raw post.replylink}" rel="nofollow"><img id="quoteimg_{vb:raw post.postid}" src="{vb:raw vboptions.cleargifurl}" alt="{vb:rawphrase reply_with_quote}" /> <vb:if condition="$post['forwardlink']">{vb:rawphrase reply_to_private_message}<vb:else />{vb:rawphrase reply_with_quote}</vb:if></a>
<vb:if condition="$show['multiquote_post']"><span class="seperator">&nbsp;</span></vb:if>
</vb:if>
<vb:if condition="$show['multiquote_post']">

<a class="multiquote" href="{vb:raw post.replylink}" rel="nofollow" onclick="return false;" id="mq_{vb:raw post.postid}"><img id="mq_image_{vb:raw post.postid}" src="{vb:raw vboptions.cleargifurl}" alt="{vb:rawphrase multi_quote_this_message}" />&nbsp;</a>
</vb:if>


My images are:
images/buttons/edit.gif
images/buttons/multiquote_off.gif
images/buttons/quickreply.gif
images/buttons/quote.gif

Any help is appreciated!

[Lynne]

You've posted some code but not a link for us to actually see what it does. We need to be able to see the results in order to help fix an issue.

[revo70]

Apologies Lynne.

The screenshot attached shows how it currently looks -- the buttons have disappeared and the Multi-Quote falls off the page.

[Lynne]

So... you are using vb4 and you uploaded new images to your site and you are not seeing them on the page? You do realize that the button images get shown via CSS. For instance, for the edit button when viewing:
.postbitlegacy .postfoot .textcontrols a.editpost, .postbit .postfoot .textcontrols a.editpost, .eventbit .eventfoot .textcontrols a.editevent {
....

background-image: url("images/buttons/edit_40b.png");
}
The edit button when hovering:
.postbitlegacy .postfoot .textcontrols a.editpost:hover, .postbit .postfoot .textcontrols a.editpost:hover, .eventbit .eventfoot .textcontrols a.editevent:hover {
....
background-image: url("images/buttons/edit_40b-hover.png");
}
So, adding a file called edit.gif is going to do nothing unless you somehow change the whole way that the buttons are done. You will need to get rid of the css for those buttons and then replace the cleargif image and edit text here:
<img src="{vb:raw vboptions.cleargifurl}" id="editimg_{vb:raw post.postid}" alt="{vb:rawphrase edit_delete_message}" /> {vb:rawphrase edit_post}with just your own image code:
<img src="images/buttons/edit.gif" id="editimg_{vb:raw post.postid}" alt="{vb:rawphrase edit_delete_message}" />That is true for all the buttons in the postbit for vB4.

Alternately, call the images by the same names used in vB4 and replace them and they will show up instead of the old ones. Then, just remove the text if you don't want the text.

[revo70]

Thanks for your help, Lynne. I'm getting there, but not all the way yet.

I changed the images to reflect their name in the CSS.....but when I delete {vb:rawphrase reply} after each, they disappear again. But without doing that, the text shows underneath the buttons again.

So here's what I have now:

[Lynne]

Replace the text with non-breakable spaces - & n b s p ; (spaces added so it doesn't get parsed into nothingness).