Guest iamjohngalt Posted July 28, 2005 Share Posted July 28, 2005 I'm a newbie to cubecart so if this is nothing new, please keep that in mind. I was not happy with the product +more images popup window layout. However, I didn't want to re-write cubecart so I made a couple of small changes that make it more usable, in my opinion. Before you make these changes backup the following 2 files: skins\your_skin_name\styleTemplates\content\viewProd.tpl skins\your_skin_name\styleTemplates\popup\prodImages.tpl I wanted the popup to have the thumbnails of the extra pics on the left in a scrollable area, and the selected full size pic on the right. This makes better use of the space IMO. To do this, I changed my skin prodImages.tp to put the output in a 1 row , 2 cell table. The entire file is below so you should be able to copy and paste if you wish: -------------------- B E G I N F I L E --------------------------------- <!-- BEGIN: prod_images --> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset={VAL_ISO}" /> <title>{META_TITLE}</title> <link href="../skins/{VAL_SKIN}/styleSheets/popup.css" rel="stylesheet" type="text/css" /> <script language="javascript" src="../js/jslibrary.js"></script> </head> <body> <div id="pageSurround"> <div style="padding: 5px;"> <table><tr><td> <div id="divThumbsImg"> <!-- BEGIN: thumbs --> <div style="padding: 5px;"><a href="java script:getImage('{VALUE_SRC}');"><img src="{VALUE_THUMB_SRC}" width="{VALUE_THUMB_WIDTH}" alt="Click for larger image" border="0" class="thumbsImg" /></a></div> <!-- END: thumbs --> </div> </td><td> <div id="divMainImg"> <img id="img" src="{VALUE_MASTER_SRC}" alt="Full size view" /> </div> </td></tr></table> </div> <br clear="all" /> </div> <div style="text-align: center;"> <a href="java script:window.close();" class="popupLink">Close Window</a> </div> </body> </html> <!-- END: prod_images --> -------------------- E N D F I L E --------------------------------- I also changed my skin version of viewProd.tpl. The only change here is to make the popup window larger to display the images better for my use. The resulting popup window should be 640 by 480. Only line 13 is changed in viewProd.tpl as follows: -------------------- B E G I N C O D E -------------------- <div style="text-align: center;"><a href="java script:openPopUp('extra/prodImages.php?productId={PRODUCT_ID}', 'images', 638, 478, 0);" class="txtDefault">{LANG_MORE_IMAGES}</a></div> -------------------- E N D C O D E -------------------- So its fairly simple and I like the results. your mileage may vary. I'd love to hear of a better way if you have one. Link to comment Share on other sites More sharing options...
Guest vrakas Posted July 28, 2005 Share Posted July 28, 2005 2 things my friend 1) What is your sites URL so we can have a look? 2) What where the changes you made or do we have to insert and replace the whole text? :errm: Link to comment Share on other sites More sharing options...
Guest iamjohngalt Posted July 28, 2005 Share Posted July 28, 2005 Hi, vrakas (1)A jpg of the popup window is attached showing an example. (The site is not available online yet.) (2)I thought it was simpler to provide the entire code, than to try to give instructions on what was changed, but I see there are only 3 new lines. The changed lines are in BOLD -------------------- B E G I N F I L E --------------------------------- <!-- BEGIN: prod_images --> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset={VAL_ISO}" /> <title>{META_TITLE}</title> <link href="../skins/{VAL_SKIN}/styleSheets/popup.css" rel="stylesheet" type="text/css" /> <script language="javascript" src="../js/jslibrary.js"></script> </head> <body> <div id="pageSurround"> <div style="padding: 5px;"> <table><tr><td> <div id="divThumbsImg"> <!-- BEGIN: thumbs --> <div style="padding: 5px;"><a href="java script:getImage('{VALUE_SRC}');"><img src="{VALUE_THUMB_SRC}" width="{VALUE_THUMB_WIDTH}" alt="Click for larger image" border="0" class="thumbsImg" /></a></div> <!-- END: thumbs --> </div> </td><td> <div id="divMainImg"> <img id="img" src="{VALUE_MASTER_SRC}" alt="Full size view" /> </div> </td></tr></table> </div> <br clear="all" /> </div> <div style="text-align: center;"> <a href="java script:window.close();" class="popupLink">Close Window</a> </div> </body> </html> <!-- END: prod_images --> -------------------- E N D F I L E --------------------------------- and on the line 13 from viewProd.tpl: -------------------- B E G I N C O D E -------------------- <div style="text-align: center;"><a href="java script:openPopUp('extra/prodImages.php?productId={PRODUCT_ID}', 'images', 638, 478, 0);" class="txtDefault">{LANG_MORE_IMAGES}</a></div> -------------------- E N D C O D E -------------------- Link to comment Share on other sites More sharing options...
Guest vrakas Posted July 29, 2005 Share Posted July 29, 2005 Very good iamjohngalt, i will give it a try later and see how it comes out. Thanks ;) Link to comment Share on other sites More sharing options...
Guest westonmi Posted August 2, 2005 Share Posted August 2, 2005 Thanks! I'll be trying it out too. Link to comment Share on other sites More sharing options...
Guest Posted August 7, 2005 Share Posted August 7, 2005 I thought this is what I was looking for but not quite Here is a link to the store I'm working on: http://www.specializedsaddles.com/ordersho...rod&productId=2 I'm moving him from just flat HTML pages to the shopping cart, but he still wants people to be able to click on the "medium" picture for full detail http://www.specializedsaddles.com/ like I have it set here for each saddle he designs. the only place I see the pop ups used is in the admin section. I don't see a place to enable pop up images per product - am I just missing it? Thanks! Lorri Nevil Link to comment Share on other sites More sharing options...
Guest Posted August 7, 2005 Share Posted August 7, 2005 Just to let you know thanks - I was able to take a lot of what was here (make a few changes) and changed the language file to be more descriptive of the information I needed to convey - http://www.specializedsaddles.com/ordersho...rod&productId=4 What a great community this is ! Lorri Nevil Link to comment Share on other sites More sharing options...
Guest iamjohngalt Posted August 17, 2005 Share Posted August 17, 2005 kaelin, I'm glad it helped you with your work. Your site looks very nice, too. Link to comment Share on other sites More sharing options...
Guest Posted July 7, 2006 Share Posted July 7, 2006 Just to let you know thanks - I was able to take a lot of what was here (make a few changes) and changed the language file to be more descriptive of the information I needed to convey - http://www.specializedsaddles.com/ordersho...rod&productId=4 What a great community this is ! Lorri NevilHey, I love how your site turned out. I am also interested in showing more detail in my images, and I am wondering how you ended up doing that. Your images seem much larger than mine... Did you change the image size, or was it a change in the code itself? Link to comment Share on other sites More sharing options...
Guest Laura Brito Posted September 5, 2006 Share Posted September 5, 2006 I am not too worried about the scroll box on the side, that part of the mod did work for me. I removed it though, what I am really wanting is the pop up box to open up big enough to see the whole image. My images are 600 x XXX. Always 600 wide, but the height will vary depending on the image. I tried adding in the 638, 478 portion to the viewProd file and I also tried 638, 638......but nothing different happens. It is still the same size, it is still cutting off the image, and nothing changes. I am using the killer skin because it is full width. So if anyone has an idea please let me know, I have been trying to get this to work now for hours and hours..... Thanks! Laura :P Link to comment Share on other sites More sharing options...
Guest Laura Brito Posted September 5, 2006 Share Posted September 5, 2006 http://laurabrito.com/cube/index.php Here is the link to my store, so someone can see the pop up and tell me what I am doing wrong. Link to comment Share on other sites More sharing options...
markscarts Posted September 5, 2006 Share Posted September 5, 2006 Laura, I'd like to know the answer myself. Months ago I tried to help a guy with his site, who wanted this popup larger. The code there was the first attempt, but no dice. I worked in popup.tpl, css, js folder, etc. etc. etc. but no changes ever made it work :P Link to comment Share on other sites More sharing options...
Guest Laura Brito Posted September 5, 2006 Share Posted September 5, 2006 Thanks Mark, Bummer though, I see alot of people who would like this addressed. It makes the site look unprofessional, I know I am just starting, but still, it shouldn't be that hard to fix this problem. It seems to be an issue whatever we do. I tried alot of things as well and I don't know much about this program, I was able to get things different, but not how I wanted them. I need bigger images...at the very least you click the thumbnail and it pops up....at least that, I would rather do away with the popup box all together, but at the same time I am not ready to purchase a mod...so it makes it tricky. The reason I would like to do away with the pop up box is alot of people have pop ups blocked. So if it would just show all the images, one as the main, and then you click on the thumbnail and it opens up or changes it...that would work ok. Thanks anyway! I appreciate the info. Laura, I'd like to know the answer myself. Months ago I tried to help a guy with his site, who wanted this popup larger. The code there was the first attempt, but no dice. I worked in popup.tpl, css, js folder, etc. etc. etc. but no changes ever made it work Link to comment Share on other sites More sharing options...
markscarts Posted September 5, 2006 Share Posted September 5, 2006 The mod you mentioned above works very well for that; I have purchased it myself long ago and have it in use at one of my sites. Very happy with all her work. I can send you a link to my store where that image mod is in action via PM, if you want to see. Also, as to site looking unprofessional, that would depend upon what you are selling. The smaller images are just fine for a plethora of items, and the stock cubecart is just fine for most sites. Smaller images have advantages, too, less storage on your server, less bandwidth to load the images, quicker load time, etc. so IMO the cubecart stock method is professional looking for most applications. Link to comment Share on other sites More sharing options...
Guest Laura Brito Posted September 6, 2006 Share Posted September 6, 2006 Oh I agree with you, the stock site is ok for many people and looks just fine, but for some graphic intense sites (like mine will be eventually) I need to make sure people know exactly what they are getting and because most of my shipping is from Mexico I don't want them to have a surprise that is going to cost me an arm and leg to fix. So extra pictures will assure me that they saw it in all angles and the higher quality the better. That way I avoid returns. I have done this before (sells on the internet) so I have learned some hard lessons. I guess I will have to break down and buy the mod. I am going to first finish the rest of the cart and see how that goes. I did find one problem though, sometimes the same image will come up at the more images pop up, duplicates? Which is weird, that might be a bug? I don't know...so far overall it is a fantastic product. Anyway apprecie the help and I will be PMing you.. Thanks Laura The mod you mentioned above works very well for that; I have purchased it myself long ago and have it in use at one of my sites. Very happy with all her work. I can send you a link to my store where that image mod is in action via PM, if you want to see. Also, as to site looking unprofessional, that would depend upon what you are selling. The smaller images are just fine for a plethora of items, and the stock cubecart is just fine for most sites. Smaller images have advantages, too, less storage on your server, less bandwidth to load the images, quicker load time, etc. so IMO the cubecart stock method is professional looking for most applications. Link to comment Share on other sites More sharing options...
Guest vrakas Posted September 6, 2006 Share Posted September 6, 2006 This thread is old and started Jul 28 2005. Sorry for braking your chatting but you can continue this if you wish in the .org forum where all 3rd party mods are located and supported. Thank you Topic closed. Link to comment Share on other sites More sharing options...
Recommended Posts