Customise the Product Page with Sections

In Extra Product options for Woocommerce Plugin, the grouping of fields is termed as a Section. By using a Section, you can display related fields as a set in your product page.

Add a new section on the Product page

You can create a new section by going to WooCommerce → Products → Extra Product Option → Add New Section. The ‘Add new section’ button is displayed above the fields list in the plugin settings.

Editing the Added Sections

Sections can be edited by clicking on the edit (pencil) icon displayed on the side of the section in the plugin settings page in the Dashboard.

Set a display position for fields in any of the three different positions

Sections can be placed in any of the three different positions: Before Add to Cart button, After Add to Cart button and Before variation data(For variable products). To set display position for the sections,
  1. Go to the plugin settings page, and click on the edit (pencil) icon near the section’s display name to edit it.
  2. In the edit dialogue box, you can see a field named ‘Display Position’. Choose a suitable position from the drop-down.
  3. Update the Changes.

Rearrange a section in the Product page

Display order in sections is based on the newly created sections other than the default. To rearrange the sections,  
  • Go to the plugin settings page, and click on the (pencil) icon near the section’s display name to edit it.
  • In the edit dialogue box, you can see a field named ‘Display Order’. Provide a number in this field according to the order you want to arrange the sections.
  • Edit all sections and give particular numbers in the Display Order field to bring all sections to order.
    It should be noted that the Display Positions set earlier in the section properties can override the Display Order. Even if the sections are arranged according to display numbers, sections coming under same display position will display first according to the display order assigned. For example, suppose that A and C are two sections coming before Add to Cart button, and B and D come after Add to Cart button. If the Display Order assigned to A, B, C and D are 1, 2, 3 and 4 respectively, the sections will be arranged as A → C → B → D.

Duplicate sections on the Product page

A duplicate of an existing section can be created by clicking on the ‘Copy’ button next to the pencil icon for editing. Then, a popup to create a new section will appear with all the fields except the section name, filled same as that of the duplicated field. All you have to do is to assign a new section name and Save the changes.

Removing Sections from Product Page

To remove a section, click on the Remove (X) button on the top of the field list.  

Leave a Reply

Your email address will not be published. Required fields are marked *