Docs

[jeffyablon]

I realize this may be more of a woocommerce support issue than one for you guys, but I’m gonna take a shot.

When I set up a page in woocommerce with an affiliate link (and hey … that is a category in there, out of the box), the item in my home/shop/product archive page links DIRECTLY to the affiliate page.

Not what I want.

I want the image to link to my internal product page, FROM WHICH I can redirect people to the affiliate link.

There seem to be only two choices:
1) Use the affiliate link in the product page’s parameters, which does what I just said
2) Use my internal product page link, which thn has a BUY button that does NOT go to the affilate page.

So at its simplest I guess I’m asking whether there’s a way to have the link on my product page link to somewhere other than the link built into woocommerce. Circular logic be bad!

Thanks

[John Ezra]

Hi there,

Thanks for writing in. The overall logic “the product page then links to the affiliate if it’s an affiliate category item” is quite simple. With static sites,it would just be manually placing the links, with dynamic sites like WordPress though you need to write loops and conditionals.

Regretfully what you need isn’t a feature offered by X. It could be possible with custom development, but this would be outside the scope of support we can offer. You may wish to consult a developer to assist you with this. X is quite extensible with child themes, so there are plenty of possibilities.

To give you some direction, here are some thoughts you can try taking to woocommerce or a developer.

1.Conditional to check if the product post is an affiliate category.

2. If yes output a custom single post page template that looks similar to regular post type template with the difference of the buy button now links to affiliate page.

3. If not an affiliate product to just output the regular product post type template.

Hope this helsp and sorry we can’t provide further support on this. Thanks for understanding. Take care!

[jeffyablon]

Appreciate it. Like I said, I thought it might not be a “you” thing. Was just hoping .

[Rad]

You’re welcome Jeffy! And thanks for understanding.

[jeffyablon]

OK, so… I’ve done some investigation and I believe that if I re-frame my question this IS an “X” issue:

The way Woocommerce works, as I now understand it, it that if a theme has built-in support for it (as X does), then it is the theme that controls pretty much everything about how thing look and work. Hierarchically, this means that the implementation of theme-specific woocommerce functions and styles override woo’s native stuff, in much the same way using a child theme overrides a parent.

By extension, one can secondarily override your woo work by setting up woo stuff in the child of x, matching your override of woo. This is good.

Since each of the products on my shop page LOOKS like X (specifically, the buy buttons act just like the carousel items in Ethos), I presume the place they are pointed (“buy/add to cart”) is also controlled by X. And since if someone DOES get to the actual product pages there’s still (the same) buy mechanism.

So: how do I replace what I now think is YOUR CHOICE of where the button point from the shop archive page to the PRODUCT pages instead of jumping directly to “buy/add to cart”?

[Rad]

Hi Jeffy,

You should able to find the templates used for woocommerce at /x/woocommerce/. We do not create our own standard for woocommerce, as you can see it still under /woocommerce/ folder as their rule.

Woocommerce also uses filters and action as their standard. And you should find this at /x/framework/functions/global/plugins/woocommerce.php

We can’t cover any documentation or help of how these filters/actions should be use, so you may consult woocommerce for that.

how do I replace what I now think is YOUR CHOICE of where the button point from the shop archive page to the PRODUCT pages instead of jumping directly to “buy/add to cart”?

From /x/framework/functions/global/plugins/woocommerce.php

function x_woocommerce_after_shop_loop_item_title() {
  woocommerce_get_template( 'loop/add-to-cart.php' );
  echo '</header></div>';
}

Which still load the native add cart template from woocommerce plugin directory and not from X.

Hope this helps.

[jeffyablon]

yes, but … no. It’s you guys, at least in part. see this thread: https://theme.co/x/member/forums/topic/no-woocommerce-product-image-sizes/

SOMETHING is wrong in your Woo implementation, at least as it lives, un-altered, on my site.

As I suggested in the other thread, maybe who ever is working on the two should put their heads together.

[Rad]

Hi Jeffy,

There is no wrong with woocommerce template implementation, it still simply follow the correct template structure from /plugins/woocommerce/templates/ check it and you should see. The changes we add is just to make it look more alike with X theme styling/design. So again, you should consult woocommerce documentation for integration/development. And I gave you the list of files and folder where you can find these integration from X for woocommerce and you will not find them on other places, but just from those given references.

And about your other thread,

Yes, switching will of course give some differences because of the integration and css styling are not available on other theme. Again, you’re free to edit/override those given templates ( /x/woocommerce/ and /x/framework/functions/global/plugins/woocommerce.php ). What you will do on those templates are your call, I could guide you though. But more than X’s default feature like extending, modification, and enhancement of current integration are out of our capability as we don’t cover woocommerce development. Our job is primarily addressing bugs, fixes, and some tweaking.

1. Image Control – Yes, this is overriden because X is meant to be responsive. And image sizes are computed dynamically base on total width of the layout. Now imagine if your thumbnail is 150×150, and your site is displayed on mobile with 600px width. Then 150px image on 600px contain will be ugly as it will be pixelated. If you wish to use woocommerce default size, then just edit /x/framework/functions/global/plugins/woocommerce.php and find this code

// Shop Thumbnail
// =============================================================================

//
// $stack_shop_thumb = 'shop_catalog' and woocommerce_get_product_thumbnail()
// can be used as well to echo out the thumbnail.
//

function x_woocommerce_shop_thumbnail() {

  GLOBAL $product;

  $stack            = x_get_stack();
  $stack_thumb      = 'entry-full-' . $stack;
  $stack_shop_thumb = $stack_thumb;
  $id               = get_the_ID();
  $rating           = $product->get_rating_html();

  woocommerce_show_product_sale_flash();
  echo '<div class="entry-featured">';
    echo '<a href="' . get_the_permalink() . '">';
      echo get_the_post_thumbnail( $id , $stack_shop_thumb );
      if ( ! empty( $rating ) ) {
        echo '<div class="star-rating-container aggregate">' . $rating . '</div>';
      }
    echo '</a>';
  echo "</div>";

}

You can either replace this code :

$stack_thumb = 'entry-full-' . $stack;

with this :

$stack_thumb = 'shop_catalog';

or replace this code :

echo get_the_post_thumbnail( $id , $stack_shop_thumb );

with this :

echo woocommerce_get_product_thumbnail();

Again, X is made to be responsive so this might have effect at X’s current styling.

2. Product Link – the thumbnail itself is the link. I’m not really sure what you’re trying to achieve as I can successfully go to product page by clicking them. It’s not a mistake, but intended per stack. The problem I can see from your setup is that the hover is bigger than your images. They are small. Try this one http://theme.co/x/demo/shop/ethos/. X is made for medium size images to accomodate changes for smaller or bigger screen and we can’t limit it to specific dimensions (hence responsive).

You can either use larger image or use css to change hover behaviour ( no need to modify any php or woocommerce integration because it’s all done by just css, unless need to use different structure which in case you need someone to do it ). Custom CSS could be tricky since your area are too small, so probably we will just make it under the images and disable hover.

I’ll forward our discussion to see if possible to add option to completely disable woocommerce integration. But that will remove all X theming for woocommerce.

Thank you.

[jeffyablon]

OK, so: at the end of the day I accept (no seriously, I do) your logic.

But imagine that you’re me, ask “why is this feature missing?” (and it is), are told to check against a “standard”, PASS the standard, and then are told the question never mattered.

That’s a response to the image thing. But if your logic is about responsive image sizing, I’m afraid it’s nonsense, since my uploaded images are showing up in what looks like a cell in a table. That outline is not of my making, nor does it match the aspect ration of the image it bounds:

As for the “missing links” thing (that’s really the simplest way to put it, right?) being a matter of adhering to the standards of the theme, well, I call shenanigans. I like that the buy button looks the way it does. But that doesn’t mean it’s “the way the theme is”; the individual and distinct elements on the Woo template aren’t related in the same way the grouping of items in your Carousel are. On a WP page or post I could find a way to augment each free-standing element with a link, but within the Woo framework, where it sets a standard (it has) and you override the standard (you have), I should have a next-step opportunity to override you—assuming X adhered to the Woo standard.

Since their standard seems to be altering the archive-product.php file, and you guys have overridden even THAT (you have none!), it leaves fixing your work way harder than it ought to be. What file contains YOUR template?

Listen: I’m upset, and sure there’s a venting element to this, but mostly I’m just wishing X was ACTUALLY as great as it SEEMS to be, and as I’ve said in other posts you guys playing fast and loose with “da rules” is not OK.

I’m done. I’d appreciate if you could point me at the right file to edit to mess with your edited template file in Woo. Meantime, I’ll analyze the options.

Thanks for your time.

[Rad]

Hi Jeffy,

Would you mind showing what features are missing? I can see your screenshots from other theme but they are simply showing the default layout of woocommerce loop template where add cart, buy button, and etc are. On X, they are simply available when you hover your product on shop page. And since you’re using a really small ( landscape image ), the hover simply overflow the height of your image. Thus, it also cover the thumbnail that supposed to be clickable for product page.

I am simply saying the X still follow woocommerce standard, so the modification of X existing woocomerce templates should be still as the same as woocommerce standard. No more, and no less. So anyone could edit X woocomerce template as long they know how to do woocommerce development. And we do not teach woocommerce development, though we can always point you out or assist for some tweaks. I point you out to the folder and files assuming that you have knowledge about woocommerce or you have someone that will do woocommerce development.

Then about your screenshot, as I’m saying X is good for medium size image so it can still respond to smaller and larger image. But, you’re still using a very small image, how about providing the url address so I could simply check if its because of any custom css. Like max-width and min-width that alters default size.

What else you need to override? The item loops? Then just duplicate a copy of /x/woocomerce/loop/loop-start.php and /x/woocomerce/loop/loop-end.php to your child theme. Or modify the links? then it should be /x/woocommerce/content-product.php.

X override /wp-content/plugins/woocommerce/templates/ by /x/woocommerce/ , so you can override /x/woocommerce/ too by creating it again from your child theme /x-child-ethos/woocommerce/

/wp-content/plugins/woocommerce/templates/loop/loop-start.php = /x/woocomerce/loop/loop-start.php
/wp-content/plugins/woocommerce/templates/loop/loop-end.php = /x/woocomerce/loop/loop-end.php
/wp-content/plugins/woocommerce/templates/content-product.php = /x/woocommerce/content-product.php
…..
…
..
/../

I’m not really sure what area of woocommerce is missing or need to be overriden since your initial query is about page link, add/buy button, and thumbnail size which I did answered.

Before I explain about archive-product.php template :

This is the overriding process by wordpress and woocommerce :

1. First, it checks if the template is available on child, if available then it will use it. If not then it will find it on it’s parent theme.
2. Second, it checks if the template is available on parent theme, if available, then it will use it. If not then it will check woocommerce plugin’s template directory and use the available template.

This process applies for all templates, and not just archive-product.php

Now back to archive-product.php :

So if /x/woocommerce/archive-product.php does not exists, it will then use /wp-content/plugins/woocommerce/templates/archive-product.php

But, if /x/woocommerce.php is present at any theme, woocommerce will use it for all woocomerce page ( shop index, categories, product page, etc. ), so /x/woocommerce.php is also simply the archive-product.php.

http://docs.woothemes.com/document/template-structure/ : Please note: when creating woocommerce.php in your theme’s folder, you won’t then be able to override the woocommerce/archive-product.php custom template (in your theme) as woocommerce.php has the priority over all other template files. This is intended to prevent display issues.

/x/woocommerce.php is pointing to /x/framework/views/ethos/woocommerce.php where the content template being used is /x/woocommerce/content-product.php

So the conclusion is, the template being used for shop page, category page, product page, and etc. is /x/woocommerce.php and /x/woocommerce/content-product.php, and it just switches to /loop/ and /single-product/ internally by woocomerce itself ( <?php woocommerce_content(); ?> )

I’m not trying to cause any conflict 😛 But I’m just trying to explain on the best I can 🙂

Hope this explains them further 🙂

Thanks and sorry for long explanation.

Edit :

If you will check /wp-content/plugins/woocommerce/templates/archive-product.php, you should see that it also uses content-product.php which overridden by /x/woocommerce/content-product.php. And /x/woocomerce.php also uses content-product.php

Again, /x/woocommerce.php is just the same as /wp-content/plugins/woocommerce/templates/archive-product.php and the only difference is that in /x/woocomerce.php, it loads X’s styling and structure for header, footer, content layout, wrapper, and etc. to contain content-product.php and its /loops/ /single-product/ templates.

[jeffyablon]

Please don’t feel the need to apologize for being long; I appreciate the help.

I showed this in https://theme.co/x/member/forums/topic/no-woocommerce-product-image-sizes/#post-171860. There IS a missing element in X: the ability to ever get to the actual product pages FROM the archive shop page. SO …

Under 2014 (the ‘standard’, if there is such a thing, but in any event the closest thing to vanilla that comes out of the box with WordPress) each product on the shop page includes both a “buy/add to cart” button AND a link to the product page, In this image I’ve pointed to both:

Under X, there is no link to the product page. The same (featured) image is used, but instead of it being a link to the product page it becomes a link to the “buy button” when hovered over. THAT’S FINE, AND CONSISTENT WITH THE STACK’S DESIGN. But what if a vistor wants to read more, or I want them to? That requires access to the product page and there is NO way to get there!:

You guys have merged the two visual elements (that’s the “consistent with X-Ethos styling” thing, and GREAT). But somehow there still needs to be access to the actual product page (where, by the way, you have used the same merged-element thing … WHICH IS FINE ONCE PEOPLE ARE THERE.

At its simplest (and presumably this IS simple if you tell me what to put and where), I want to put a text link underneath “the merged-imaged/buy button thingy” on the shop page (and only on the shop page).

Like I said: you guys have set this up in a way that is UNSTANDARD, in that what Woocommerce treats as not only two elements on the shop page, but with two separate functions, is now merged (OK; that’s the style) into one function (but that’s the resulting problem).

I JUST CHECKED SOMETHING ELSE: this problem exxists on Ethos, but NOT in Renew (nor presumably the other stacks): Here it is in Renew:

SEE? YOU GUYS GOOFED THIS UP !!!! I’m kind of shocked that no-one has noticed before now, but, there you go!

You still have both wpadmin and ftp access, by the way, as noted in the private message inside, https://theme.co/x/member/forums/topic/no-woocommerce-product-image-sizes/ , by the way .

Make sense?

[jeffyablon]

OK, STOP, I FIGURED IT OUT.

And the bottom line is that I MISSED SOMETHING AND I APOLOGIZE.

But I also think your “no image size control mechanism” situation is a problem (and remember you guys had me test for it being there in the 2014 Theme to see if there was something wrong in my WP installation).

So the problem is really about me using an image size that’s too small. I’d standardized on 120×56. I finally realized that there ARE TWO LINKS ON YOUR POP-UPS, but because I’d used such small images it ended up LOOKING LIKE there was only one:

When I replaced an image with something larger, it’s … all visible and usable (I’d argue it’s not obvious that there are two links in there, but THERE ARE TWO LINKS IN THERE, so like I said, I’m wrong, and I apologize:

Thank you for staying with me until I beat the answer into my own head. Like I said, I think the ways you guys are handling image control is a problem, but at least I get it now. IF YOU DON’T WANT TO CHANGE THIS, I think you should at least consider better documentation.

Thanks. Apologies again.

JY

[Zeshan]

No problem! And thank you for your feedback, I’ll forward it to our development team. Have a good day! 🙂

[Author]

Posts