Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0
angeldr

Move text or code block from "Additional Info" to "Product page description" product detail excerpt

Question

Posted (edited)

Hello dear forum, 

I am struggling for days to find a way with CSS how to move "Additional info" of a product up to a "Product's description excerpt"

(Text from   "ProductItem-additional"   move to    "ProductItem-details-excerpt")

I am a newbie in coding, except have a general idea how to use chrome's inspector, but still have no idea how to interchange them or create from scratch via CSS.

If someone could help me solve this puzzle I would deeply appreciate you, and because of you, i will finally be able to sleep at night.

Thank you in advance!

 

2020-06-27_17-14-25.png

 

Edited by angeldr

Share this post


Link to post

11 answers to this question

Recommended Posts

  • 1
$('section.ProductItem-details').html( $('section.ProductItem-additional').html() );
$('section.ProductItem-additional').html('');

This jQuery would do it, but personal accounts don't allow code injection.


Free Squarespace 7.1 Anchor Link and Accordion Plugins available here!

If I replied to one of your questions with code, it was either CSS or jQuery.

To add CSS, go to Design -> Custom CSS

jQuery needs some additional steps. Head here: https://code.jquery.com/ and click on minified, under jQuery 3.x and copy that code into Squarespace.

After you put that code into the code injection section in Squarespace, you can add the code I supplied. The code from me will need <script> added before it and </script> added after it (only for jQuery).

There are two places that you can add the code, one is site wide (adds to all pages). Settings -> Advanced -> Code Injection

The other is for a specific page (adds to one page only). Pages -> Gear Icon next to the page -> Advanced

Share this post


Link to post
  • 0

Please post a link to your page, thanks.


Free Squarespace 7.1 Anchor Link and Accordion Plugins available here!

If I replied to one of your questions with code, it was either CSS or jQuery.

To add CSS, go to Design -> Custom CSS

jQuery needs some additional steps. Head here: https://code.jquery.com/ and click on minified, under jQuery 3.x and copy that code into Squarespace.

After you put that code into the code injection section in Squarespace, you can add the code I supplied. The code from me will need <script> added before it and </script> added after it (only for jQuery).

There are two places that you can add the code, one is site wide (adds to all pages). Settings -> Advanced -> Code Injection

The other is for a specific page (adds to one page only). Pages -> Gear Icon next to the page -> Advanced

Share this post


Link to post
  • 0
Posted (edited)
17 hours ago, rwp said:

Please post a link to your page, thanks.

www.*************.com

Thank you

Edited by angeldr

Share this post


Link to post
  • 0

Do you want to remove the text on the right, and replace it with the description, or keep it all?


Free Squarespace 7.1 Anchor Link and Accordion Plugins available here!

If I replied to one of your questions with code, it was either CSS or jQuery.

To add CSS, go to Design -> Custom CSS

jQuery needs some additional steps. Head here: https://code.jquery.com/ and click on minified, under jQuery 3.x and copy that code into Squarespace.

After you put that code into the code injection section in Squarespace, you can add the code I supplied. The code from me will need <script> added before it and </script> added after it (only for jQuery).

There are two places that you can add the code, one is site wide (adds to all pages). Settings -> Advanced -> Code Injection

The other is for a specific page (adds to one page only). Pages -> Gear Icon next to the page -> Advanced

Share this post


Link to post
  • 0
Posted (edited)
6 minutes ago, rwp said:

Do you want to remove the text on the right, and replace it with the description, or keep it all?

Ideally i would just remove the standard product description text because "additional info" text is more flexible can also add a button, but at the same time it would be very helpful to keep it all just in case i will need in the future, both methods would be really helpful 🙂

Edited by angeldr

Share this post


Link to post
  • 0

Do you have a premium account?


Free Squarespace 7.1 Anchor Link and Accordion Plugins available here!

If I replied to one of your questions with code, it was either CSS or jQuery.

To add CSS, go to Design -> Custom CSS

jQuery needs some additional steps. Head here: https://code.jquery.com/ and click on minified, under jQuery 3.x and copy that code into Squarespace.

After you put that code into the code injection section in Squarespace, you can add the code I supplied. The code from me will need <script> added before it and </script> added after it (only for jQuery).

There are two places that you can add the code, one is site wide (adds to all pages). Settings -> Advanced -> Code Injection

The other is for a specific page (adds to one page only). Pages -> Gear Icon next to the page -> Advanced

Share this post


Link to post
  • 0
3 minutes ago, rwp said:

Do you have a premium account?

Due to the outbreak I recently downgraded my plan, at this moment i do not have the premium, it is simply personal plan.

Share this post


Link to post
  • 0
53 minutes ago, rwp said:

$('section.ProductItem-details').html( $('section.ProductItem-additional').html() );
$('section.ProductItem-additional').html('');

This jQuery would do it, but personal accounts don't allow code injection.

Thank you so much I will try once i upgrade, do you happen to know if there is a slight little chance to get this result with CSS?

or Code Injection is the only option you can offer at this moment?

Share this post


Link to post
  • 0

Maybe? I'd have to look at it more. JQuery was just the easiest way I could think of doing it.


Free Squarespace 7.1 Anchor Link and Accordion Plugins available here!

If I replied to one of your questions with code, it was either CSS or jQuery.

To add CSS, go to Design -> Custom CSS

jQuery needs some additional steps. Head here: https://code.jquery.com/ and click on minified, under jQuery 3.x and copy that code into Squarespace.

After you put that code into the code injection section in Squarespace, you can add the code I supplied. The code from me will need <script> added before it and </script> added after it (only for jQuery).

There are two places that you can add the code, one is site wide (adds to all pages). Settings -> Advanced -> Code Injection

The other is for a specific page (adds to one page only). Pages -> Gear Icon next to the page -> Advanced

Share this post


Link to post
  • 0
4 hours ago, angeldr said:

Thank you so much I will try once i upgrade, do you happen to know if there is a slight little chance to get this result with CSS?

or Code Injection is the only option you can offer at this moment?

CSS can't sove this problem. You need to use jQuery/JavaScript


You can send your question to my email to get faster answer.

How to Setup Password & Share URL  Armadillo - Free portfolio template

Share this post


Link to post
  • 0
9 hours ago, tuanphan said:

CSS can't solve this problem. You need to use jQuery/JavaScript

I understood, appreciate your reply!

 

13 hours ago, rwp said:

Maybe? I'd have to look at it more. JQuery was just the easiest way I could think of doing it.

Thank you for your time. Appreciate!

Share this post


Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...