Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • November 24, 2015 at 4:04 am #541312
    senso

    Hi,

    I’ve added a custom content below the product thumbnail in the single product page. I added the content in the product-thumbnails.php template. The content is included as intended, however, I run into one small problem.

    The images that I included in that custom content seem to stretch to fill the entire width of that section. I’ve made sure the images are properly cropped to the right size before uploading. I’ve added the width and height too but to no avail.

    I noticed the content that I added happened to be within the <div class=”images”>. I reckon adding the content after the close </div> of the images class is able to solve this problem? I can’t seem to figure out where the close div is for that class. Can you point me to the right direction?

    Thanks!

    • This topic was modified 9 years ago by senso.
    November 24, 2015 at 6:42 am #541339
    Basilis

    Hi senso!

    can you please provide us a link to your site, so we can see the issue and try assist?
    Thanks a lot

    Best regards,
    Basilis

    November 24, 2015 at 9:43 am #541395
    senso

    Hi Basilis,

    Sorry, it is offline.
    Are there any areas that sound confusing in my first post? I’ll try to explain again.
    Thanks

    November 24, 2015 at 1:10 pm #541551
    Yigit

    Hey!

    Can you please add your custom code including a closing Div tag as following 

    </div><div class="your-custom-content">Custom stuff here</div>

    Regards,
    Yigit

    November 25, 2015 at 6:16 am #542138
    senso

    Hi Yigit,

    Thanks for the help. I doubt it works with the extra </div> added. With and without my custom code, by adding the extra </div> as suggested, the right sidebar appears and pushed the content(product title, tabs, price…etc) below.

    May I know where is the original closed div found? I can’t find any reference to it. I’ll just have to add the custom content after the original </div> tag.

    • This reply was modified 9 years ago by senso.
    November 25, 2015 at 7:32 am #542159
    Basilis

    Hey!

    Based on your issues, it seems we can not have a solution, if we can not see it live.
    It might be more areas left open, so we can understand where it is happening and where you have to add the </div>.

    Thanks a lot

    Cheers!
    Basilis

    November 25, 2015 at 8:03 am #542179
    senso

    Hi Basilis,

    With other theme, I don’t have this problem. It seems Enfold added this extra </div> tag. You can replicate the problem with the default enfold theme and woocommerce. Additional set up I did is “remove” Sidebar.

    Try to add some custom content after the product thumbnail and you’ll get what I mean. The additional content is wrapped within the <div class=”images”> </div>.

    For testing purpose snippet

    add_action( 'woocommerce_product_thumbnails', 'include_test_info', 40);
function include_test_info() {
   echo 'abcdefg' ;
}

    I have attempted to use “wc_get_template” to display the custom content and the problem persists.

    November 25, 2015 at 8:14 am #542185
    senso

    Hi,

    Arghh….After more search, I found in this file enfold/config-woocommerce/config.php, want to check if is what causing the issue I experienced? 

    #
# wrap single product image in an extra div
#
add_action( 'woocommerce_before_single_product_summary', 'avia_add_image_div', 2);
add_action( 'woocommerce_before_single_product_summary',  'avia_close_image_div', 20);
if(!function_exists('avia_add_image_div'))
{
	function avia_add_image_div()
	{
		echo "<div class='single-product-main-image alpha'>";
	}
}

if(!function_exists('avia_close_image_div'))
{
	function avia_close_image_div()
	{
		global $avia_config;
		if(is_product()) {
		$avia_config['currently_viewing'] = "shop_single";
		get_sidebar();
		}
		echo "</div>";
	}
}

    Thanks for the patience!

    November 25, 2015 at 1:06 pm #542360
    Yigit

    Hey!

    Please try commenting out

    echo "</div>";

    and check if that helps. You explained the issue well but seeing source code always helps. If your website is online, please post the link to it :)

    Cheers!
    Yigit

    November 26, 2015 at 12:33 am #542794
    senso

    Hi Yigit,

    Thanks for the help.
    No. It doesn’t work either with commenting out
    echo "</div>"
    I reckon the product thumbnail is wrapped with sidebar? I’m curious why is it done in this way?

    November 26, 2015 at 3:54 am #542825
    senso

    I’ve also noticed by adding a url to that section, it automatically generates below code within the a tag

    rel=product_images[grouped]

    <span class="image-overlay overlay-type-extern" style="display: none;">
<span class="image-overlay-inside"></span>
</span>

    I’m very confused now.

    I just simply need to add my custom section after the div image class, not within it. Is it very difficult to achieve this?

    You can replicate the issue with a default enfold and woocommerce setup.

    November 26, 2015 at 4:44 am #542840
    senso

    I think I’ve opened a can of worms… …

    1. With any contents added below the product thumbnail, it is wrapped within the image class div.

    2. Any a href tag auto generates rel=product_images[grouped].

    3. By manually adding a </div> (to close the image class) before the custom content, the content on the right and sidebar (if any) will be pushed below the product thumbnail. If the sidebar has removed, it will produce an empty space above the product title. The empty space is due to the hidden sidebar..

    4. The HTML output the sidebar despite being removed. http://i.imgur.com/x4ubf8t.png

    November 26, 2015 at 11:24 am #542992
    Yigit

    Hey!

    Can you please try adding following code to Functions.php file in Appearance > Editor

    function avia_content_after_wcthumb() {
    echo '<div class="your-custom-content">here it goes</div>';
}
add_action( 'woocommerce_product_thumbnails' , 'avia_content_after_wcthumb', 20 );

    If that does not work, why do not you add your custom content to top of your sidebar?
    To be honest, i am still not sure the exact changes you would like to make. You can post the codes you would like to use here using http://pastebin.com/.

    Regards,
    Yigit

  • Author
    Posts
Viewing 13 posts - 1 through 13 (of 13 total)
  • You must be logged in to reply to this topic.