Block Buttons - Revision history

An: /* Button global settings */

2026-01-27T07:00:00Z

Button global settings

← Older revision		Revision as of 07:00, 27 January 2026
Line 61:		Line 61:
	\|Target		\|Target
	\|Open the link in the same window, a new window, or modal.		\|Open the link in the same window, a new window, or modal.
	Modal (Pro only): opens a link in a Lightbox. Useful for embedding content from YouTube, Vimeo, Instagram, TikTok, or Google Maps/Forms.<br/>		Modal (Pro only): opens a link in a Lightbox. Useful for embedding content from YouTube, Vimeo, Instagram, TikTok, or Google Maps/Forms.<br/><br/>
	You can choose from three modal sizes (Pro plan only): <br/>		You can choose from three modal sizes (Pro plan only): <br/>
	- Modal (Pro) for a standard popup <br/>		- Modal (Pro) for a standard popup <br/>

An: /* Button global settings */

2026-01-27T06:59:41Z

Button global settings

← Older revision		Revision as of 06:59, 27 January 2026
Line 61:		Line 61:
	\|Target		\|Target
	\|Open the link in the same window, a new window, or modal.		\|Open the link in the same window, a new window, or modal.
	Modal (Pro only): opens a link in a Lightbox. Useful for embedding content from YouTube, Vimeo, Instagram, TikTok, or Google Maps/Forms.		Modal (Pro only): opens a link in a Lightbox. Useful for embedding content from YouTube, Vimeo, Instagram, TikTok, or Google Maps/Forms.<br/>
	You can choose from three modal sizes (Pro plan only):		You can choose from three modal sizes (Pro plan only): <br/>
	- Modal (Pro) for a standard popup		- Modal (Pro) for a standard popup <br/>
	- Large Modal (Pro) for a bigger popup		- Large Modal (Pro) for a bigger popup <br/>
	- Large Full (Pro) for a full-screen popup.		- Large Full (Pro) for a full-screen popup.<br/>
	\|-		\|-
	\|Animate On Scroll		\|Animate On Scroll

An: /* Button global settings */

2026-01-27T06:58:04Z

Button global settings

← Older revision		Revision as of 06:58, 27 January 2026
Line 62:		Line 62:
	\|Open the link in the same window, a new window, or modal.		\|Open the link in the same window, a new window, or modal.
	Modal (Pro only): opens a link in a Lightbox. Useful for embedding content from YouTube, Vimeo, Instagram, TikTok, or Google Maps/Forms.		Modal (Pro only): opens a link in a Lightbox. Useful for embedding content from YouTube, Vimeo, Instagram, TikTok, or Google Maps/Forms.
			You can choose from three modal sizes (Pro plan only):
			- Modal (Pro) for a standard popup
			- Large Modal (Pro) for a bigger popup
			- Large Full (Pro) for a full-screen popup.
	\|-		\|-
	\|Animate On Scroll		\|Animate On Scroll

An: /* Add a Size Chart Link in the Product Information Section */

2025-07-31T07:30:04Z

Add a Size Chart Link in the Product Information Section

← Older revision		Revision as of 07:30, 31 July 2025
Line 114:		Line 114:
	*'''Step 2''': Add a Button block in the '''Product Information''' section.		*'''Step 2''': Add a Button block in the '''Product Information''' section.
	:{{Note\| If it's in the core product information, skip '''Section Settings''' and just add the Block you want. [[File:Product info section note.jpg\|800px\|frameless]]\|inline}}		:{{Note\| If it's in the core product information, skip '''Section Settings''' and just add the Block you want. [[File:Product info section note.jpg\|800px\|frameless]]\|inline}}
	*Step 3: Configure the button. Link to the page from Step 1 in the '''Button URL''' and set the '''Target''' to '''Modal'''.		*'''Step 3''': Configure the button. Link to the page from Step 1 in the '''Button URL''' and set the '''Target''' to '''Modal'''.
	:		:[[File:Button modal config2.jpg\|800px\|frameless]]
	[[File:Button modal config2.jpg\|800px\|frameless]]

	Once done, clicking the button will show your size chart in a modal popup.		Once done, clicking the button will show your size chart in a modal popup.

An: /* Add a Size Chart Link in the Product Information Section */

2025-07-31T07:28:09Z

Add a Size Chart Link in the Product Information Section

← Older revision		Revision as of 07:28, 31 July 2025
Line 115:		Line 115:
	:{{Note\| If it's in the core product information, skip '''Section Settings''' and just add the Block you want. [[File:Product info section note.jpg\|800px\|frameless]]\|inline}}		:{{Note\| If it's in the core product information, skip '''Section Settings''' and just add the Block you want. [[File:Product info section note.jpg\|800px\|frameless]]\|inline}}
	*Step 3: Configure the button. Link to the page from Step 1 in the '''Button URL''' and set the '''Target''' to '''Modal'''.		*Step 3: Configure the button. Link to the page from Step 1 in the '''Button URL''' and set the '''Target''' to '''Modal'''.
	:[[File:Button modal ~~config~~.jpg\|800px\|frameless]]		:
			[[File:Button modal config2.jpg\|800px\|frameless]]

	Once done, clicking the button will show your size chart in a modal popup.		Once done, clicking the button will show your size chart in a modal popup.

An: /* Add a Size Chart Link in the Product Information Section */

2025-07-31T07:18:16Z

Add a Size Chart Link in the Product Information Section

← Older revision		Revision as of 07:18, 31 July 2025
Line 105:		Line 105:

	====Add a Size Chart Link in the Product Information Section====		====Add a Size Chart Link in the Product Information Section====

			[[File:Sizechart link.jpg\|800px\|frameless]]

			If you want to add a '''Size Chart''' link in the '''Product Information''' section (Shopify product detail page) that opens in a modal popup, follow these steps:

	*'''Step 1''': Create a page for your size chart under Shopify > '''Pages'''. Add your size chart details or custom content.		*'''Step 1''': Create a page for your size chart under Shopify > '''Pages'''. Add your size chart details or custom content.
	:[[File:Size chart page.jpg\|800px\|frameless]]		:[[File:Size chart page.jpg\|800px\|frameless]]
	*'''Step 2''': Add a Button block in the '''Product Information''' section.		*'''Step 2''': Add a Button block in the '''Product Information''' section.
	:{{Note\| If it's in the core product information, skip Section Settings and just add the Block. [[File:Product info section note.jpg\|800px\|frameless]]\|inline}}		:{{Note\| If it's in the core product information, skip '''Section Settings''' and just add the Block you want. [[File:Product info section note.jpg\|800px\|frameless]]\|inline}}
	*Step 3: Configure the button. Link to the page from Step 1 in the '''Button URL''' and set the '''Target''' to '''Modal'''.		*Step 3: Configure the button. Link to the page from Step 1 in the '''Button URL''' and set the '''Target''' to '''Modal'''.
	:[[File:Button modal config.jpg\|800px\|frameless]]		:[[File:Button modal config.jpg\|800px\|frameless]]

An: /* Add a Size Chart Link in the Product Information Section */

2025-07-31T07:06:12Z

Add a Size Chart Link in the Product Information Section

← Older revision		Revision as of 07:06, 31 July 2025
Line 107:		Line 107:

	*'''Step 1''': Create a page for your size chart under Shopify > '''Pages'''. Add your size chart details or custom content.		*'''Step 1''': Create a page for your size chart under Shopify > '''Pages'''. Add your size chart details or custom content.
			:[[File:Size chart page.jpg\|800px\|frameless]]
	*'''Step 2''': Add a Button block in the '''Product Information''' section.		*'''Step 2''': Add a Button block in the '''Product Information''' section.
	:{{Note\| If it's in the core product information, skip Section Settings and just add the Block. [[File:Product info section note.jpg\|800px\|frameless]]\|inline}}		:{{Note\| If it's in the core product information, skip Section Settings and just add the Block. [[File:Product info section note.jpg\|800px\|frameless]]\|inline}}
	*Step 3: Configure the button. Link to the page from Step 1 in the Button URL and set the Target to Modal.		*Step 3: Configure the button. Link to the page from Step 1 in the '''Button URL''' and set the '''Target''' to '''Modal'''.
			:[[File:Button modal config.jpg\|800px\|frameless]]

	Once done, clicking the button will show your size chart in a modal popup.		Once done, clicking the button will show your size chart in a modal popup.

An: /* How to enable the Modal for the CTAs */

2025-07-31T06:46:33Z

How to enable the Modal for the CTAs

← Older revision		Revision as of 06:46, 31 July 2025
Line 103:		Line 103:
	*'''Step 2''': Add a '''Button''' section and configure it as you wish.		*'''Step 2''': Add a '''Button''' section and configure it as you wish.
	*'''Step 3''': Under the Target field, choose '''Modal'''.		*'''Step 3''': Under the Target field, choose '''Modal'''.

			====Add a Size Chart Link in the Product Information Section====

			*'''Step 1''': Create a page for your size chart under Shopify > '''Pages'''. Add your size chart details or custom content.
			*'''Step 2''': Add a Button block in the '''Product Information''' section.
			:{{Note\| If it's in the core product information, skip Section Settings and just add the Block. [[File:Product info section note.jpg\|800px\|frameless]]\|inline}}
			*Step 3: Configure the button. Link to the page from Step 1 in the Button URL and set the Target to Modal.

			Once done, clicking the button will show your size chart in a modal popup.

	===Add other content blocks===		===Add other content blocks===

An: /* Button Settings */

2025-03-27T01:54:18Z

Button Settings

← Older revision		Revision as of 01:54, 27 March 2025
Line 25:		Line 25:
	{{Note\|''If you are new to our Easy Content Builder, please take a look at the [[Add_section_settings\|Add Sections]] section for detailed instructions on how to add a section to your theme.\|reminder}}		{{Note\|''If you are new to our Easy Content Builder, please take a look at the [[Add_section_settings\|Add Sections]] section for detailed instructions on how to add a section to your theme.\|reminder}}

	=== Button ~~Settings~~ ===		=== Button global settings ===
	From the Shopify theme editor, click on '''Button''' on the sidebar to view the details of settings.		From the Shopify theme editor, click on '''Button''' on the sidebar to view the details of settings.

An: /* How to add Buttons section */

2024-11-07T04:11:53Z

How to add Buttons section

← Older revision		Revision as of 04:11, 7 November 2024
Line 21:		Line 21:
	:{{Note\|Note: If you include the '''Buttons''' in the core product information, skip the step for adding '''Section Settings'''. Just add the '''Buttons'''. [[File:Ecb add section core product info.jpg\|800px\|frameless]]\|reminder}}		:{{Note\|Note: If you include the '''Buttons''' in the core product information, skip the step for adding '''Section Settings'''. Just add the '''Buttons'''. [[File:Ecb add section core product info.jpg\|800px\|frameless]]\|reminder}}

	*'''Step 2''': Add an '''Buttons''' section and customize the settings according to your preferences.		*'''Step 2''': Add a '''Buttons''' section and customize the settings according to your preferences.
	:[[File:Block button 2.png\|1200x1200px]]		:[[File:Block button 2.png\|1200x1200px]]
	{{Note\|''If you are new to our Easy Content Builder, please take a look at the [[Add_section_settings\|Add Sections]] section for detailed instructions on how to add a section to your theme.\|reminder}}		{{Note\|''If you are new to our Easy Content Builder, please take a look at the [[Add_section_settings\|Add Sections]] section for detailed instructions on how to add a section to your theme.\|reminder}}