Music

Welcome to the demo page of ASA2’s Music template. This specialized template is designed for displaying music-related data, such as artist names, labels, and track lists. It offers customization options that allow you to control its appearance and the specific information displayed, all without requiring programming skills.

The template is fully responsive, ensuring optimal viewing across various devices and screen sizes. You can adjust settings globally within the ASA2 admin panel or override them per shortcode to suit your specific needs.

Explore the features and customization possibilities of the Music template to enhance your music product displays.

Bad [VINYL]
Price: £24.69
As of: March 25, 2025 02:00 - Details
×
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on https://www.amazon.co.uk/ at the time of purchase will apply to the purchase of this product.
You save: £0.80 (3%)
11 new from £24.693 used from £17.56
Label: LEGACY RECORDINGS
Artist: Jackson, Michael (Performer)
Format: Vinyl
Release date: May 6, 2016
(* = affiliate link / image source: Amazon partner program)

Integration

There are several ways how an ASA2 product template can be integrated into a website.

This video shows how to use ASA2's Gutenberg Block to embed a products into your website using the "Music" template.

This video shows how to use ASA2's Classic Editor Button to embed products into your website using the "Music" template.

Wherever you can work with WordPress shortcodes, you can also embed products with ASA2 shortcodes. The template to be used can be defined with the tpl option. Otherwise, the template defined as the default is used.

[asa2 tpl="Music" id="123" /]

If you want to render this product template directly from PHP, e.g. in an individual page template, you can do this with the function asa2_render_product.

<?php
echo asa2_render_product(123, [
    'tpl' => 'Music'
]);

Customization

On ASA2’s admin page Templates you can customize the general options of template Music. These settings will effect the display of this template on a global scope.

 

Customization Examples

This example uses the options border_color, border_width and border_radius to customize the border layout.

[asa2 tpl="Music" id="123" border_color="#c73630" border_width=2 border_radius=20 /]
Bad [VINYL]
Price: £24.69
As of: March 25, 2025 02:00 - Details
×
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on https://www.amazon.co.uk/ at the time of purchase will apply to the purchase of this product.
You save: £0.80 (3%)
11 new from £24.693 used from £17.56
Label: LEGACY RECORDINGS
Artist: Jackson, Michael (Performer)
Format: Vinyl
Release date: May 6, 2016
(* = affiliate link / image source: Amazon partner program)

[asa2 tpl="Music" id="123" box_effect="2" /]
Bad [VINYL]
Price: £24.69
As of: March 25, 2025 02:00 - Details
×
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on https://www.amazon.co.uk/ at the time of purchase will apply to the purchase of this product.
You save: £0.80 (3%)
11 new from £24.693 used from £17.56
Label: LEGACY RECORDINGS
Artist: Jackson, Michael (Performer)
Format: Vinyl
Release date: May 6, 2016
(* = affiliate link / image source: Amazon partner program)

This example uses the option hide_price to hide the price.

[asa2 tpl="Music" id="123" hide_price="yes" /]
Bad [VINYL]
Label: LEGACY RECORDINGS
Artist: Jackson, Michael (Performer)
Format: Vinyl
Release date: May 6, 2016
(* = affiliate link / image source: Amazon partner program)

Options

This list contains all the options that are available for ASA2's product template Music, including examples of how they can be used in conjunction with shortcode.

Layout
OptionTypeValuesDescription
align string
  • "none" (None)
  • "left" (Left)
  • "center" (Center)
  • "right" (Right)
Align
max_width int 0 between 9999 Max width. Used when align is not none.
background_color string CSS compatible color value, like hex values (#ff0000) or color names (red) Background color
border_width int 0 between 99 Border width. In pixels. 0 for no border.
border_radius int 0 between 99 Border radius. In pixels. > 0 for rounded corners.
border_color string CSS compatible color value, like hex values (#ff0000) or color names (red) Border color
box_effect string
  • "0" (None)
  • "1" (Raised box look)
  • "2" (Lifted corner look bottom left and right)
  • "3" (Lifted corner look bottom left)
  • "4" (Lifted corner look bottom right)
  • "5" (Lifted corners with increased angles)
  • "6" (Curved shadow at the bottom of the box)
  • "7" (Curved shadow at the top and bottom of the box)
  • "8" (Rounded shadows on either side of the box)
Box shadow effect
Image
OptionTypeValuesDescription
image_size string
  • "small" (Small)
  • "medium" (Medium)
  • "large" (Large)
Image size
image_max_width int 0 between 999 Image max width. In pixels. 0 - 999. 0 for none.
main_image_slideshow bool "yes" / "no" Activate slideshow of additional images on main image
slideshow bool "yes" / "no" Show slideshow of additional images below other data
slideshow_max int 0 between 999 Maximum slideshow items (0 = all)
image_effect string
  • "0" (None, no linking at all)
  • "lightbox" (Add lightbox tag and link to large version)
  • "imgpreview" (Image preview to large version on mouse hover)
  • "link_to_shoppage" (Image links to shop page)
Image effect
Title
OptionTypeValuesDescription
title_color string CSS compatible color value, like hex values (#ff0000) or color names (red) Title color. No default. The title will be displayed in the default text color of your page, if none is set here.
title_font_size int 1 between 500 Title font size. In percent.
title_length int 0 between 999 Title max length. Limits the title to a maximum length of characters. 0 for unlimited.
Price
OptionTypeValuesDescription
price_color string CSS compatible color value, like hex values (#ff0000) or color names (red) Price color. The color in which the price text is displayed.
hide_price bool "yes" / "no" Hide price(s)
show_new_and_used_prices bool "yes" / "no" Show new and used prices
show_price_disclaimer bool "yes" / "no" Show price disclaimer. "Details" link next to date of last update.
last_update_format string custom text Last item update date format. Used in price disclaimer. Supports PHP date function format. Example: d.m.Y H:i:s
show_merchant bool "yes" / "no" Show product merchant (if available)
Button
OptionTypeValuesDescription
show_buy_button bool "yes" / "no" Show buy button
button_target string
  • "shop" (Shop page)
  • "buy" (Buy page)
Button target. Decides whether the button should link to the product page or the buy page.
Details
OptionTypeValuesDescription
show_features bool "yes" / "no" Show product features (if available)
features_length int 0 between 99 Number of features. How many feature items to show before the "Show more" link. 0 = no limit.
feature_text_length int 0 between 1000 Feature text max length. Maximum number of letters for each feature before the "..." get displayed. 0 = no limit.
features_font_size int 1 between 100 Features font size (in percent)
show_description bool "yes" / "no" Show product description (if available)
description_font_size int 1 between 100 Description font size (in percent)
description_length int 0 between 1000 Description length. Number of letters before the "show more" link get displayed. 0 = no limit.
font_size_smaller int 1 between 100 Smaller font size (in percent)
font_size_smallest int 1 between 100 Smallest font size (in percent)
show_label bool "yes" / "no" Show label
show_format bool "yes" / "no" Show format. CD, DVD etc.
show_artist bool "yes" / "no" Show artist
show_tracks bool "yes" / "no" Show tracks
show_release_date bool "yes" / "no" Show release date
release_date_format string custom text Release date format. Supports PHP date function format. Example: d.m.Y H:i:s
Misc
OptionTypeValuesDescription
disclaimer string
  • "none" (None)
  • "asterisk_and_text" (Asterisk in title link and button. Disclaimer text in each template.)
  • "asterisk_only" (Asterisk in title link and button. No disclaimer text.)
Disclaimer. Shows a disclaimer text.
structured_data string
  • "none" (None)
  • "json_ld" (JSON-LD format)
Structured Data. Include structured data at the end of the template
custom_css string
  • "none" (None)
  • "json_ld" (JSON-LD format)
Custom CSS. Custom CSS that is applied to all occurrences of this template on a page and is only included once in the source code.