EN
Searching...

Button & Links

Using Button & Links, you can add any type of Link (1) to the section. You can add a Button/Image link/Social Icon/Text Link.

You can duplicate (2), edit (3), or delete (4) the existing button.

In this article:

  1. Adding Buttons/Links.
  2. Styling Buttons/Links.

Adding Buttons/Links.

  • To add any type of link to the section, click on the + Add Link button.

  • The + Add Link option provides four ways to add a link:

Button

Add a button to the list item. You will be able to update:

  1. Button Label – Set the button label.
  2. Button Link – Specify the link.
  3. Target Window – Choose to open the page in the same or a new window.
  4. Button Style – Choose the button style to be the default (set in the Buttons and Links tab of the Design section), Solid, Outline, or a Text Link.
  5. Choose the button color to be default or invert the color. 

Text Link

Add a text link to the list item.

You will be able to update:

  1. Set the text label.
  2. Specify the text link.
  3. Target Window – Choose to open the page in the same or a new window.

Image 

Add an image and link it to any page.

  • Once you have uploaded the image, it shows up this way. Click on the link to edit it.

  • From here, you can:
    1. Upload/Change the image.
    2. Button Link – Specify the link.
    3. Target Window – Choose to open the page in the same or a new window.

Note

Site Title will be used as Alt Text for the button’s Image to enhance searchability.

Social Icon

  • Add a social icon to the list item.

  • You can manage:
    1. The social icon to be linked.
    2. Specify your relevant social profile path.
    3. Target Window – Choose to open the page in the same or a new window.

The Style Options for Button & Links

The style options will be present under the Style tab while managing the section.

You will have multiple style options for the Button & Links as follow:

  1. Specify the Space Between Button/Links that have been added.
  2. Specify the Space Above Button/Links.
  3. Choose the Hover Effect for the Button/links.

  1. Choose the size of the Normal Button that you have added in the Button/Links. 
  2. Specify the height of the Image Button if you have added an image link in the Button/Links. 
  3. Specify the size of the Icon Button if you have added a social icon in the Button/Links. 

If you have added a social icon in the Button/Links above, then:

  1. Choose the Social Icon Type/Shape.
  2. Choose the Social Icon Color Style. If you have chosen the Brand Color, then the icon’s brand color will be inherited.
    If you have chosen the Selected Color option above then:
    1. Specify the Social Icon Color.
    2. Specify the Social Icon Background Color.

Example

For suppose, you have added an Amazon social link in the Button/Links, and specified the icon color as Red and the icon background color as Green, then the icon will show up as below:

Tagged:

Can't find what you're looking for?

Get in touch with a Pixpa Expert.

Contact Us