Move blocks & CSS

Hello,
I have some difficulties with moving some blocks and some css. May you help me?

Makis

Hello,

Thank you so much for contacting our support center.

Here is a code snippet that you may add to the functions.php file in your child theme to swap tabs content with products.

add_action( 'basel_after_product_content', 'basel_open_upsells_container', 40 );
add_action( 'basel_after_product_content', 'woocommerce_upsell_display', 50 );
add_action( 'basel_after_product_content', 'basel_close_upsells_container', 60 );
add_action( 'wp', 'basel_remove_upsells', 1000 );
function basel_remove_upsells(){
	remove_action( 'basel_woocommerce_after_sidebar', 'woocommerce_upsell_display', 10 );
}
function basel_open_upsells_container(){
	echo '<div class="container related-and-upsells">';
}
function basel_close_upsells_container(){
	echo '</div>';
}

Unfortunately, we can’t change the color of a text-underline property in CSS.

And here is a snippet that you need to add to the Custom CSS to remove red line.

.single-product .upsells .slider-title:before{
	display: none;
}

Kind Regards
XTemos Studio

Hello again
Thanks for your kind help!!! It works perfect but i have a problem that the upsell block shows twice…may you take a look and remove or add some code to function.php?

Hi, replace the line in functions.php file

add_action( 'wp', 'basel_remove_upsells', 1000 );

with this one

add_action( 'wp', 'basel_remove_upsells', 1100 );.

Sorry again but now i have some changes to product layout…may you help me?

Do you mean that they are caused by code we gave you? Please, temporarily remove it so we can see is it caused by changes or not.

Yes they are caused from the final code. I remove it now and back again to the first code you gave me. May you test it?

OK, we see the issue. But unfortunately, it means that this block can’t be moved to the desired position without any breaks. If you want to do this you may need to perform additional code customization to change product page markup completely that is out of our free theme support scope.

Thank you for understanding.

Please see the note.

Lets try an another hot fix using CSS. Try to add the following code snippet to the Custom CSS in Theme Settings

.single-product .related-and-upsells .variations_form{
	display: none;
}
.single-product .related-and-upsells .price{
	font-size: 16px;
}
.single-product .related-and-upsells .price .amount{
	color: #949494 !important;
}

YES!!!! It works and you’re perfect!!!

A last favor…may you help me to half the distance between the blocks to close the project?

Attachments:

You must be logged in to view attached files.

You can reduce this margin with the following Custom CSS code

.single-product-content .product-image-summary {
	margin-bottom:10px;
}

It would be kind of you if you will rate our theme with 5 stars and leave a positive feedback on Theme Forest 🙂

Kind Regards
Xtemos

Thanks a lot for your kind help!

You are welcome 🙂

[Author]

Posts