Modifying the fancy display

[Jill]

I’d like to make some changes to the fancy2 display. These are the changes:

clear background on top part

my choice color for bottom background

no link border on buy button

add in a few custom fields to bottom part – after the buy button and before the price

use words in price field (free / premium / or more prices than one)

I’m not actually using a BUY button, it is a VISIT button, so I don’t want to use a price option dropdown. I need to list the prices as something like 29.00-99.00. Or use a word, like Free. I know I can use 0.00 for free, but I can’t add in more than one price. So if that field could just be made into a text field, that would work.

Also, for the buy/visit button. I am using a redirect url, and I get an error everytime I save a product. It works ok, but each product saves verrrrrrry slowly. This is the error message:

The URL specified in the “Product Page URL” field does not seem to be a valid URL! Please check this value again:

and then the url.

Anyway, how would I go about making these changes?

Thanks

[amin007]

FYI: The fancy displays are pre-configured product display that we provide with the plugin. It is not possible to come up with one design that will fit everyone’s need. There are a few fancy display options available in eStore. If they do not suit you then you can obviously change that coding (if you are familiar with coding) but another option is to design your product display on a WordPress post or page yourself. You have complete freedom in designing this post or page with whatever details you want to place in there. When you are done just place a button without any style associated with it using eStore on this page. There is a shortcode that lets you create a buy button without any product information displayed by eStore.

With that said, Open the “eStore_misc_functions.php” file and find the following function:

function show_product_fancy_style2

Thats the function responsible for fancy2 display so modify it as you like.

Regarding the error “The URL specified in ….” if you know for sure that the URL is correct then you can ignore that message (it won’t cause any harm).

[mircosarto]

I’d like to make some changes to the fancy5 display function.

I need to change background and font color, border and buy button style

How I can do it ?

Thanks

[amin007]

Open the CSS file for the eStore Extra Shortcode plugin and look for a section like the following:

/*=== Fancy 5 CSS ===*/

Thats where all the fancy 5 CSS is. Modify the values as you like.

[Rinaldo]

I also want to make a change in Fancy 2 : I would like to change the order “Buy button – Select Variation – Price into “Select Variation – Price – Buy button” ( as it should be imho) and I looked at the code in eStore_misc_functions.php and estore.css but cant figure it out. I use my own button image with url/settings and the price does not depend on variation.

Would be grateful for any tips.

Thanks in advance!

[amin007]

You will need to modify the “get_button_code_fancy2_for_element” function to change fancy2 display.

The following code in that function is responsible for the showing the button.

get_input_button($ret_product->button_image_url);

If you want to place the button after the variation then place that line after the variation code.

[Rinaldo]

Thanks!

[Jane]

While we’re finding out where to modify things… I’d really like all my “variations” boxes smaller with a different, smaller typeface. Also, on the display for the NextGen gallery, I’d like the type to be left justified rather than center. Where would I find these variables?

This is my site: http://www.closed-circle.net/WhereItsAt/?page_id=5#DTB

thanks!

[amin007]

All the variations field in eStore has a CSS class attached to it so you can easily target that class and customize the look of it. You can add the following to the CSS file and customize the variation select boxes look and feel:

.eStore_variation

{

/* add your CSS here */

}

[Susnos]

@Jane I find a easy way of getting my text to the left with NextGen display. You can make that change in stylesheet for NextGen: located at: closed-circle.net/WhereItsAt/wp-content/plugins/nextgen-gallery/css/nggallery.css Ithink it is on line 136.

Find this code:

.ngg-gallery-thumbnail {

float: left;

margin-right: 5px;

text-align: center;

And change the last line like this

.ngg-gallery-thumbnail {

float: left;

margin-right: 5px;

text-align: left;

About the variation box I’m going to try what Amin explained. But I think you can make yours smaler in your style.css (for your theme constuktor). It looks like it take the code from line 710.

Find:

}

style.css (rad 1054)

input, select, textarea {

border-style: solid;

border-width: 1px;

font-size: 1.4em;

padding: 4px;

And make a change to the font-size (I think 12px look good) and the padding maby to 2px or 3px

But the sad thing is when you uppgrade your theme all your changes will be lost. So the best thing you can do is make a child theme and then do all your changes there.

Hope this was helpful.

[Jane]

@admin and susnos: Thanks so very much! Very helpful. In the process of updating the whole look and feel of the site and switching over to Athahualpa which accepts custom CSS a bit more elegantly (i.e. without losing it with an upgrade! I’ll give these a try.

[Jane]

@ Susnos again…hope somehow you get this. Just went to your website to try and send you a personal thank you. I didn’t understand a word, but the photography is STUNNING! Certainly requires no translation.

@ Admin: sorry for the personal msg. Promise I won’t do it any more.

[toshism]

Hi there,

I have seen that others have been looking to solve a similar problem that I am facing currently.

I am using fancy 2 layout for my site and would like to change the layout of the Buy button on the following url: [http://genevacharityball.com/demo/buy-your-tickets/]

On the ticket (top entry) I would like to show the Price, then the Quantity and then finally the Buy button.

On the Donate – I would like to:

1. Reduce the width of the dropdown and place it on the left to allow for the rest to fit on one line.

2. Change the label “Your Price” to “Amount”

3. Place the “Donate” button on the right of the container.

4. Hide the price

I saw that a user “Rinaldo” wanted to do something similar and an admin had answered, I found it difficult to look at the file:

wp-cart-for-digital-products/eStore_misc_functions.php

and make changes that would work.

Any help would be appreciated

[admin]

Hi, I can help you with some of the changes that can be achieved by applying a CSS but some of the other changes can’t be applied to a fancy display. The following post will explain why:

https://support.tipsandtricks-hq.com/forums/topic/can-i-put-multiple-images-and-videos-in-the-fancy-display

The above post also has a section that explains how you can create your product display too. That gives you freedom of making your display look however you want it to look like.

[Author]

Posts