Some Styling Questions in Fancy 2 Display

[journalinabox]

I love most things about how the fancy product display is working in my page, but I’m wondering if I can hack this display just a bit to work a bit better for us? Right now, I am doing some testing on this page: http://www.journalinabox.com/product-testing/

First, I don’t like the way that the quantity field displays. I don’t think it is clear that the field is connected to the text display ‘Quantity.’ Is there any way to move either ‘Quantity’ or the field to be next to each other?

Second, I have a note at the end of the description that tells how to see more pictures of the product. What I would actually love to have is an amazon type image that would have an arrow and the words, “Click to look inside” just below the actual lightbox image. Is there any way to insert this?

Thanks for your help!

[admin]

The quantity field is suppose to be next to the label by default. The following CSS on your theme is messing up the input fields a little (see the “width: 45%”?):

.format_text input, #commentform input, #commentform textarea {

border-width: 0.071em;

padding: 0.214em;

width: 45%;

}

I see you are using the thesis theme… if you follow this post you should be fine:

https://support.tipsandtricks-hq.com/forums/topic/images-appear-too-bigsmallstretched-on-thesis-theme

[journalinabox]

Hmmm… I didn’t realize this was a related issue. I already have this code

.custom .format_text input {

border-width:0.067em;

padding:0.2em;

width: auto;

}

in my custom css file because of the issue with the buttons. But, I see now that something must be overriding it because the buttons are all messed up as well. I may have to do some digging to figure out why it is now being overridden.

Any way I can change add the image below the lightbox image?

[journalinabox]

Okay. Found my coding problem and got the quantity issue fixed! Thanks! Still wondering if I can add something extra to this fancy display in the area under the lightbox image?

Thanks!

[admin]

The lightbox image is shown using a standard JQuery lightbox library. eStore doesn’t have much control over it. You can look inside the javascript code and alter the library for your customization. The file to look for is “lib/jquery.lightbox-0.5.pack.js”. This is a compressed version but there is a URL there that points to the source and you can find the original source code there.

[journalinabox]

Hmmm, I don’t want to actually add text TO the lightbox. I want to know if I can add text below the lightbox image in the fancy display? – In between the thumbnail image and the Add to Cart button.

[admin]

Ah I see, yeah you should be able to tweak the code to customize the display. The function to look for is “show_product_fancy_style2” from the “eStore_misc_functions.php” file.

[journalinabox]

Thanks! Will play with it!

[gvnet]

Hi @journalinabox,

I was wondering what you found that was causing the quantity input box to drop to the second line in fancy 2? I am using Thesis and it is happening on one of my sites too…

[admin]

@gvnet, your other post on this topic has been answered here

https://support.tipsandtricks-hq.com/forums/topic/fancy-2-quantity-field-thesis-theme

[Author]

Posts