Twinkles Posted July 26, 2013 Share Posted July 26, 2013 (edited) Hello.I am trying to replace the text here "Buy It" written in white with an image of a button.http://www.jahwaggysdubplatedownloads.com/gb/home/10-test-product-1.htmlCan someone kind out there show me where I need to edit and the code I should use please? I realize I need to link to an image which I will upload. Edited September 8, 2013 by Twinkles (see edit history) Link to comment Share on other sites More sharing options...
vekia Posted July 26, 2013 Share Posted July 26, 2013 i don't see there any "buy it", can you clarify it a bit? what exactly you want to change? you're talking about this: ? how you added this feature? Link to comment Share on other sites More sharing options...
Twinkles Posted July 26, 2013 Author Share Posted July 26, 2013 Hi Vekia, Yes that bit. Its via a module for selling MP3's. Link to comment Share on other sites More sharing options...
vekia Posted July 26, 2013 Share Posted July 26, 2013 so go to the localization > translations from the first drop down select "modules translation", click on flag now you will see list of modules and available to translate / change fields. search for this module and this strin "Buy it !" and change translation Link to comment Share on other sites More sharing options...
Twinkles Posted July 26, 2013 Author Share Posted July 26, 2013 Thanks Vekia - I dont want to change the word to another - i want to insert a button/image instead. Link to comment Share on other sites More sharing options...
vekia Posted July 26, 2013 Share Posted July 26, 2013 ahh so in this case you have to modify the module .tpl file, instead the simple "Buy it" use code with button. unfortunately i don't know how this module looks like (especially sources) so it's hard to say what and where you have to change / add Link to comment Share on other sites More sharing options...
Norwegian Rat Posted July 26, 2013 Share Posted July 26, 2013 This might work for you. Locate the tpl file as vekia said. Search for the link you want to change to a button, replace the code with this one: <a class="button" href="{$link->getPageLink('CHANGETHISTOWHEREEVERTHELINKMAYLEAD.php', true)}" title="{l s='Buy it!'}">{l s='Buy it!'}</a> Link to comment Share on other sites More sharing options...
Twinkles Posted August 19, 2013 Author Share Posted August 19, 2013 Sorry for the late reply - been away. I am not sure what to change. I have found the lable in the tpl file - but not sure what to change. I just want a small image (button) instead of the text "Buy It Now" Code from the tpl is this :- {/if} <span class="mp3_label">{$download.display_filename}</span> {if $download.physically_filename neq ''} <span class="mp3_label"><a onclick="$('#idCombination').val({$download.id_product_attribute});$('#add_to_cart .exclusive').click();$('#idCombination').val(0);">{l s='BUY IT NOW !' mod='mp3downloadmagavenue'}</a></span> {/if} Link to comment Share on other sites More sharing options...
Twinkles Posted August 20, 2013 Author Share Posted August 20, 2013 Can anyone help me? Link to comment Share on other sites More sharing options...
vekia Posted August 20, 2013 Share Posted August 20, 2013 change this: {l s='BUY IT NOW !' mod='mp3downloadmagavenue' and use some image: <img src="URL TO THE IMAGE" /> Link to comment Share on other sites More sharing options...
Twinkles Posted August 29, 2013 Author Share Posted August 29, 2013 Hi Vekia - when I try this - I end up with nothing. Do I delete the entire bit of text there, and then replace it with something like this url("img/icon/cart.gif") Link to comment Share on other sites More sharing options...
Twinkles Posted September 3, 2013 Author Share Posted September 3, 2013 Anyone help please? Link to comment Share on other sites More sharing options...
vekia Posted September 3, 2013 Share Posted September 3, 2013 sorry for late reply, where you added: url("img/icon/cart.gif") this? im asking because it is css style and you need to define block for this Link to comment Share on other sites More sharing options...
Twinkles Posted September 5, 2013 Author Share Posted September 5, 2013 Thanks for you help so far Vekia. I just replaced the text you mentioned {l s='BUY IT NOW !' mod='mp3downloadmagavenue with url("img/icon/cart.gif") Is that not correct then? Link to comment Share on other sites More sharing options...
vekia Posted September 5, 2013 Share Posted September 5, 2013 no, it isn't correct. you have to define new class in css styles, for example: .mynewclass{ url("img/icon/cart.gif") } then in .tpl file use class="mynewclass" in dom object where you want to display button Link to comment Share on other sites More sharing options...
Twinkles Posted September 5, 2013 Author Share Posted September 5, 2013 OK maybe I am not able to do this. I can create a new class in the CSS no problem. (Or could I use an absolute path to image - like www.website.com/myimage/someimage.gif ???) But after this I am lost as to what you mean. Sorry for being a newbie but huh? Link to comment Share on other sites More sharing options...
vekia Posted September 5, 2013 Share Posted September 5, 2013 can you show your code (after changes) from your tpl file + css styles definition (from stylesheet file) i will inspect it Link to comment Share on other sites More sharing options...
Twinkles Posted September 6, 2013 Author Share Posted September 6, 2013 Thanks Vekia - but thats my problem, I am not sure what to change on the tpl. For the css I added the follow to the global.css excatly as below. .buyitnowsingle{url("img/icon/cart.gif")} Then I get stuck as what to do next in the tpl file. Somewhere I guess with this code? </object> {/if} <span class="mp3_label">{$download.display_filename}</span> {if $download.physically_filename neq ''} <span class="mp3_label"><a onclick="$('#idCombination').val({$download.id_product_attribute});$('#add_to_cart .exclusive').click();$('#idCombination').val(0);">{l s='BUY IT NOW !' mod='mp3downloadmagavenue'}</a></span> {/if} </div> Link to comment Share on other sites More sharing options...
vekia Posted September 7, 2013 Share Posted September 7, 2013 <span class="mp3_label"><a class="buyitnowsingle" onclick="$('#idCombination').val({$download.id_product_attribute});$('#add_to_cart .exclusive').click();$('#idCombination').val(0);">{l s='BUY IT NOW !' mod='mp3downloadmagavenue'}</a></span> and in: .buyitnowsingle{ background: url("img/icon/cart.gif") } define also width and height related to the size of your img/icon/cart.gif image size Link to comment Share on other sites More sharing options...
Twinkles Posted September 8, 2013 Author Share Posted September 8, 2013 Thanks Vekia - but I must be stupid - I copy the code as you have suggested, but it still appears as text. I can changeit via CSS if I use background image - but it does not show the image itself. I noticed the URL does not get picked up in Firefox either? Link to comment Share on other sites More sharing options...
vekia Posted September 8, 2013 Share Posted September 8, 2013 yess because there is still {l s='BUY IT NOW !' mod='mp3downloadmagavenue'} i checked sources of your code and it looks like: .buyitnowsingle{ url("img/icon/cart.gif") height:100%; width:100% } you should use: .buyitnowsingle{ background: url("img/icon/cart.gif"); height:100%; width:100% } and of course you need to upload cart image to the img/icon/cart ! Link to comment Share on other sites More sharing options...
Twinkles Posted September 8, 2013 Author Share Posted September 8, 2013 Thansk Vekia but when I remove that bit - it removes the images too - I guess becuse they are backgrounds? The image is displaying now but behind the text and not fully in view. I do appreciate your patience. Link to comment Share on other sites More sharing options...
vekia Posted September 8, 2013 Share Posted September 8, 2013 so remove the {l s='BUY IT NOW !' mod='mp3downloadmagavenue'} from .tpl file and define width and height the same, as image has ps. we are so close Link to comment Share on other sites More sharing options...
Twinkles Posted September 8, 2013 Author Share Posted September 8, 2013 ah we really are close - I cant quite find where it goes It shows the text width etc - soooo close. <span class="mp3_label"><a class="buyitnowsingle" onclick="$('#idCombination').val({$download.id_product_attribute});$('#add_to_cart .exclusive').click();$('#idCombination').val(0);">width="25"height="25"</a></span> Link to comment Share on other sites More sharing options...
vekia Posted September 8, 2013 Share Posted September 8, 2013 i mean height and width in css styles use this style: .buyitnowsingle { display: inline-block; background: url("http://www.jahwaggysdubplatedownloads.com/themes/default/img/icon/add.png") no-repeat; height: 35px; width: 35px; } and this code: <span class="mp3_label"><a class="buyitnowsingle" onclick="$('#idCombination').val({$download.id_product_attribute});$('#add_to_cart .exclusive').click();$('#idCombination').val(0);"></a></span> Link to comment Share on other sites More sharing options...
Twinkles Posted September 8, 2013 Author Share Posted September 8, 2013 ahhhh so close. I almost have it - (I changed the image) and it is not looking quite right but almost. Link to comment Share on other sites More sharing options...
vekia Posted September 8, 2013 Share Posted September 8, 2013 to the styles add: position: absolute; Link to comment Share on other sites More sharing options...
Twinkles Posted September 8, 2013 Author Share Posted September 8, 2013 (edited) Getting closer! They seem to overlap when directly above like on this product. http://www.jahwaggysdubplatedownloads.com/gb/home/35-wayne-mcarthur.html Edited September 8, 2013 by Twinkles (see edit history) Link to comment Share on other sites More sharing options...
vekia Posted September 8, 2013 Share Posted September 8, 2013 so what to change right now? Link to comment Share on other sites More sharing options...
Twinkles Posted September 8, 2013 Author Share Posted September 8, 2013 Sorry just edited my last post - check this product and you will see http://www.jahwaggysdubplatedownloads.com/gb/home/35-wayne-mcarthur.html Link to comment Share on other sites More sharing options...
vekia Posted September 8, 2013 Share Posted September 8, 2013 in this case you need to add padding to the divs in this case, in global.css use this: #mp3download div {padding:5px;} Link to comment Share on other sites More sharing options...
Twinkles Posted September 8, 2013 Author Share Posted September 8, 2013 Vekia Sir - you are officially my hero! Thank you so much for your help! This is one job I can tick off. On to combination issues - but I will start another thread for this I will mark this has solved. Link to comment Share on other sites More sharing options...
vekia Posted September 8, 2013 Share Posted September 8, 2013 glad to hear that i could help you a little in this case This is our common success best regards Link to comment Share on other sites More sharing options...
siblibusro Posted September 8, 2013 Share Posted September 8, 2013 @vekia i send you message in fb please advise regards Link to comment Share on other sites More sharing options...
vekia Posted September 8, 2013 Share Posted September 8, 2013 to my personal account? i haven't received any message from you there Link to comment Share on other sites More sharing options...
siblibusro Posted September 9, 2013 Share Posted September 9, 2013 i send to Miłosz Myszczuk accountis it you ?? or ? Link to comment Share on other sites More sharing options...
vekia Posted September 9, 2013 Share Posted September 9, 2013 yea that's right, maybe i don't see your message because we aren't friends on FB? Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now