# Product Page Buttons

These buttons can be added and configured through the theme editor. More advanced setups and button placements can be achieved via code access.

{% hint style="info" %}
**Theme 2.0 required.**

Product page buttons are app blocks, which can only be used in 2.0 themes. Other themes need to add these buttons via  [code-editor](https://docs.swish.app/customizations/code-editor "mention").
{% endhint %}

### Style

Select a Wishlist button style. This uses the global colour and button values from app settings.

![product-style.png](https://1937747638-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FnXXi1yNhTBzSF0GRtx54%2Fuploads%2Fh9Fl9KQxTNQU5hAWoynQ%2Fproduct%20style.png?alt=media)

### Alignment

Adjust the Wishlist button alignment when it’s not displayed [full width](https://www.notion.so/Product-Page-Buttons-1-2aa354d5617e4e7f95b01e444f045a06?pvs=21).

Use content alignment when the button is set to [full width](https://www.notion.so/Product-Page-Buttons-1-2aa354d5617e4e7f95b01e444f045a06?pvs=21).

![product-alignment.png](https://1937747638-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FnXXi1yNhTBzSF0GRtx54%2Fuploads%2FdVozmd19CCgiiMOrHp17%2Fproduct%20alignment.png?alt=media)

### Spacing

Adjust the Wishlist button spacing. All values are in px.

Note: Negative values can be used in order to reduce the spacing if surrounding elements have excessive margins.

![product-spacing.png](https://1937747638-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FnXXi1yNhTBzSF0GRtx54%2Fuploads%2Fy52xZrvPjoSdLBxQWupL%2Fproduct%20spacing.png?alt=media)

### Max width

Use this setting to restrict the maximum width of the Wishlist button.

When set to 0 the max width is turned off.

### Full width

When active the button will stretch to fill the entire available space or its [max width](https://www.notion.so/Product-Page-Buttons-1-2aa354d5617e4e7f95b01e444f045a06?pvs=21).

### Show text

Hide or show the Wishlist button text.

### Show icon

Hide or show the Wishlist button icon.

### Icon

Adjust the Wishlist button icon style. Icons will use the global [colour](https://www.notion.so/App-Settings-49f83f5f7fc84a6cba90d06254c637f9?pvs=21) values from [app settings](https://www.notion.so/App-Settings-49f83f5f7fc84a6cba90d06254c637f9?pvs=21).

![product-icon.png](https://1937747638-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FnXXi1yNhTBzSF0GRtx54%2Fuploads%2FiEis4lfOEkE1iQ5zH3OY%2Fproduct%20icon.png?alt=media)