Create Template For Multiple Pages - Revision history

An: /* How to change to existing fonts on Shopify */

2024-05-16T04:02:51Z

How to change to existing fonts on Shopify

← Older revision		Revision as of 04:02, 16 May 2024
Line 99:		Line 99:
	* Next to the theme that you want to edit, click '''Customize'''.		* Next to the theme that you want to edit, click '''Customize'''.
	* Use the Template drop-down menu to select a template.		* Use the Template drop-down menu to select a template.
	* Click on '''Theme Settings''' (the gear icon) > '''Typography'''		* Click on '''Theme Settings''' (the gear icon) > '''Typography''' (where you can change the font of all pages and templates on your Shopify store)
	:[[File:Ecb-css-theme-scope.jpg\|frameless\|386x386px]]		:[[File:Ecb-css-theme-scope.jpg\|frameless\|386x386px]]
	* In your '''Typography''' settings, click the '''Change''' button to update your headings and body text fonts.		* In your '''Typography''' settings, click the '''Change''' button to update your headings and body text fonts.

An: /* How to change to existing fonts on Shopify */

2024-05-16T03:48:21Z

How to change to existing fonts on Shopify

← Older revision		Revision as of 03:48, 16 May 2024
Line 101:		Line 101:
	* Click on '''Theme Settings''' (the gear icon) > '''Typography'''		* Click on '''Theme Settings''' (the gear icon) > '''Typography'''
	:[[File:Ecb-css-theme-scope.jpg\|frameless\|386x386px]]		:[[File:Ecb-css-theme-scope.jpg\|frameless\|386x386px]]
	* In your '''Typography''' settings, click the '''Change''' button to update your headings and body text fonts. [[File:Shopify theme font config.jpg\|border\|frameless\|800x800px]]		* In your '''Typography''' settings, click the '''Change''' button to update your headings and body text fonts.
			:[[File:Shopify theme font config.jpg\|border\|frameless\|800x800px]]

	:{{Note\|'''Handy tips''': Check the checklist to pick a font combination (Plus 10 free font pairings to enhance your Shopify store): [https://posstack.com/blog/top-free-font-pairings-for-shopify view details].\|reminder}}		:{{Note\|'''Handy tips''': Check the checklist to pick a font combination (Plus 10 free font pairings to enhance your Shopify store): [https://posstack.com/blog/top-free-font-pairings-for-shopify view details].\|reminder}}

An: /* How to change to existing fonts on Shopify */

2024-05-16T03:47:49Z

How to change to existing fonts on Shopify

← Older revision		Revision as of 03:47, 16 May 2024
Line 101:		Line 101:
	* Click on '''Theme Settings''' (the gear icon) > '''Typography'''		* Click on '''Theme Settings''' (the gear icon) > '''Typography'''
	:[[File:Ecb-css-theme-scope.jpg\|frameless\|386x386px]]		:[[File:Ecb-css-theme-scope.jpg\|frameless\|386x386px]]
	* In your '''Typography''' settings, click the '''Change''' button to update your headings and body text fonts.		* In your '''Typography''' settings, click the '''Change''' button to update your headings and body text fonts. [[File:Shopify theme font config.jpg\|border\|frameless\|800x800px]]

	:{{Note\|'''Handy tips''': Check the checklist to pick a font combination (Plus 10 free font pairings to enhance your Shopify store): [https://posstack.com/blog/top-free-font-pairings-for-shopify view details].\|reminder}}		:{{Note\|'''Handy tips''': Check the checklist to pick a font combination (Plus 10 free font pairings to enhance your Shopify store): [https://posstack.com/blog/top-free-font-pairings-for-shopify view details].\|reminder}}

An: /* How to change to existing fonts on Shopify */

2024-05-16T03:39:00Z

How to change to existing fonts on Shopify

← Older revision		Revision as of 03:39, 16 May 2024
Line 100:		Line 100:
	* Use the Template drop-down menu to select a template.		* Use the Template drop-down menu to select a template.
	* Click on '''Theme Settings''' (the gear icon) > '''Typography'''		* Click on '''Theme Settings''' (the gear icon) > '''Typography'''
			:[[File:Ecb-css-theme-scope.jpg\|frameless\|386x386px]]
	* In your '''Typography''' settings, click the '''Change''' button to update your headings and body text fonts.		* In your '''Typography''' settings, click the '''Change''' button to update your headings and body text fonts.

An: /* How to change to existing fonts on Shopify */

2024-05-16T03:37:55Z

How to change to existing fonts on Shopify

← Older revision		Revision as of 03:37, 16 May 2024
Line 99:		Line 99:
	* Next to the theme that you want to edit, click '''Customize'''.		* Next to the theme that you want to edit, click '''Customize'''.
	* Use the Template drop-down menu to select a template.		* Use the Template drop-down menu to select a template.
	* Click on '''Theme Settings''' (the ~~paintbrush~~ icon) > '''Typography'''		* Click on '''Theme Settings''' (the gear icon) > '''Typography'''
	* In your '''Typography''' settings, click the '''Change''' button to update your headings and body text fonts.		* In your '''Typography''' settings, click the '''Change''' button to update your headings and body text fonts.

	{{Note\|'''Handy tips''': Check the checklist to pick a font combination (Plus 10 free font pairings to enhance your Shopify store): [https://posstack.com/blog/top-free-font-pairings-for-shopify view details].\|reminder}}		:{{Note\|'''Handy tips''': Check the checklist to pick a font combination (Plus 10 free font pairings to enhance your Shopify store): [https://posstack.com/blog/top-free-font-pairings-for-shopify view details].\|reminder}}

	======Adjust the font size, rounded corners, background color======		======Adjust the font size, rounded corners, background color======

An: /* How to change to existing fonts on Shopify */

2024-05-16T03:34:43Z

How to change to existing fonts on Shopify

← Older revision		Revision as of 03:34, 16 May 2024
Line 102:		Line 102:
	* In your '''Typography''' settings, click the '''Change''' button to update your headings and body text fonts.		* In your '''Typography''' settings, click the '''Change''' button to update your headings and body text fonts.

	'''Handy tips''': Check the checklist to pick a font combination (Plus 10 free font pairings to enhance your Shopify store): [https://posstack.com/blog/top-free-font-pairings-for-shopify view details].		{{Note\|'''Handy tips''': Check the checklist to pick a font combination (Plus 10 free font pairings to enhance your Shopify store): [https://posstack.com/blog/top-free-font-pairings-for-shopify view details].\|reminder}}

	======Adjust the font size, rounded corners, background color======		======Adjust the font size, rounded corners, background color======

An: /* Adjust the font size, rounded corners, background color */

2024-05-16T03:34:09Z

Adjust the font size, rounded corners, background color

← Older revision		Revision as of 03:34, 16 May 2024
Line 93:		Line 93:

	::[[File:Ecb sections padding margin.jpg\|frameless\|1917x1917px]]		::[[File:Ecb sections padding margin.jpg\|frameless\|1917x1917px]]

			====== How to change to existing fonts on Shopify ======

			* From your Shopify admin, go to '''Online Store''' > '''Themes'''.
			* Next to the theme that you want to edit, click '''Customize'''.
			* Use the Template drop-down menu to select a template.
			* Click on '''Theme Settings''' (the paintbrush icon) > '''Typography'''
			* In your '''Typography''' settings, click the '''Change''' button to update your headings and body text fonts.

			'''Handy tips''': Check the checklist to pick a font combination (Plus 10 free font pairings to enhance your Shopify store): [https://posstack.com/blog/top-free-font-pairings-for-shopify view details].

	======Adjust the font size, rounded corners, background color======		======Adjust the font size, rounded corners, background color======

An: /* Adjust the font size, rounded corners, background color */

2024-02-29T04:03:28Z

Adjust the font size, rounded corners, background color

← Older revision		Revision as of 04:03, 29 February 2024
Line 97:		Line 97:
	*If you want to change your font size, button, global background, border radius (rounded corners), etc., you can do so using the ECB's Custom CSS.		*If you want to change your font size, button, global background, border radius (rounded corners), etc., you can do so using the ECB's Custom CSS.

	:{{Note\|For Pro plan: In addition to the standard Custom CSS feature, you have an '''CSS Generator''' option - a handy ~~way~~ to ~~customize your theme '''without coding'''~~. [[Custom CSS#Adjust the font size, border radius, background color\|Learn more]]. \|reminder}}		:{{Note\|For Pro plan: In addition to the standard Custom CSS feature, you have an '''CSS Code Generator''' option - a handy option to generate CSS code automatically. [[Custom CSS#Adjust the font size, border radius, background color\|Learn more]]. \|reminder}}
	:[[File:Ecb-custom-css-v2.jpg\|border\|frameless\|800x800px]]		:[[File:Ecb-custom-css-v2.jpg\|border\|frameless\|800x800px]]

An: /* Adjust the font size, rounded corners, background color */

2024-02-29T04:02:25Z

Adjust the font size, rounded corners, background color

← Older revision		Revision as of 04:02, 29 February 2024
Line 97:		Line 97:
	*If you want to change your font size, button, global background, border radius (rounded corners), etc., you can do so using the ECB's Custom CSS.		*If you want to change your font size, button, global background, border radius (rounded corners), etc., you can do so using the ECB's Custom CSS.

	:{{Note\|For Pro plan: In addition to the standard Custom CSS feature, you have an '''~~Automatically Generate~~ CSS''' option - a handy way to customize your theme '''without coding'''. [[Custom CSS\|Learn more]]. \|reminder}}		:{{Note\|For Pro plan: In addition to the standard Custom CSS feature, you have an '''CSS Generator''' option - a handy way to customize your theme '''without coding'''. [[Custom CSS#Adjust the font size, border radius, background color\|Learn more]]. \|reminder}}
	:[[File:Ecb-custom-css-v2.jpg\|border\|frameless\|800x800px]]		:[[File:Ecb-custom-css-v2.jpg\|border\|frameless\|800x800px]]


	====Step 3: Assign the new template====		====Step 3: Assign the new template====

An: /* Adjust the font size, rounded corners, background color */

2024-02-29T04:01:18Z

Adjust the font size, rounded corners, background color

← Older revision		Revision as of 04:01, 29 February 2024
Line 95:		Line 95:

	======Adjust the font size, rounded corners, background color======		======Adjust the font size, rounded corners, background color======
	*If you want to change your font size, button, global background, border radius (rounded corners), etc., you can do so using the ECB's Custom CSS~~: [https://www.youtube.com/watch?v=gN20FiUvVZc 5-min video tutorial]~~.		*If you want to change your font size, button, global background, border radius (rounded corners), etc., you can do so using the ECB's Custom CSS.

	:{{Note\|For Pro plan: In addition to the standard Custom CSS feature, you have an '''Automatically Generate CSS''' option - a handy way to customize your theme '''without coding'''. [[Custom CSS\|Learn more]]. \|reminder}}		:{{Note\|For Pro plan: In addition to the standard Custom CSS feature, you have an '''Automatically Generate CSS''' option - a handy way to customize your theme '''without coding'''. [[Custom CSS\|Learn more]]. \|reminder}}
	:[[File:Ecb-custom-css-v2.jpg\|border\|frameless\|800x800px]]		:[[File:Ecb-custom-css-v2.jpg\|border\|frameless\|800x800px]]

	==== Step 3: Assign the new template====
			====Step 3: Assign the new template====

	======For Products======		======For Products======
Line 108:		Line 109:
	*Click on checkboxes next to each product you want to apply the new template.		*Click on checkboxes next to each product you want to apply the new template.
	*Then, click on '''Bulk Edit'''.		*Then, click on '''Bulk Edit'''.
	:[[File:Ecb - Bulk edit.png\|border\|frameless\|1024x1024px]]		: [[File:Ecb - Bulk edit.png\|border\|frameless\|1024x1024px]]
	*In the Bulk editor, click the '''Columns''' drop-down menu, and then in the '''General''' section, click the '''Template''' checkbox.		*In the Bulk editor, click the '''Columns''' drop-down menu, and then in the '''General''' section, click the '''Template''' checkbox.
	:[[File:Ecb bulk edit3.jpg\|border\|frameless\|1024x1024px]]		:[[File:Ecb bulk edit3.jpg\|border\|frameless\|1024x1024px]]
	*Click the template field of the first line, then hold the shift key, and then click the template field of the last line. A blue shading will appear around the items you have selected.		*Click the template field of the first line, then hold the shift key, and then click the template field of the last line. A blue shading will appear around the items you have selected.
	*Using the drop-down menu, choose a new template for the selected items.		*Using the drop-down menu, choose a new template for the selected items.
Line 119:		Line 120:
	The bulk editing feature for blog posts and pages is no longer available. So, follow the steps below to assign a template to blog posts or pages on an individual item level:		The bulk editing feature for blog posts and pages is no longer available. So, follow the steps below to assign a template to blog posts or pages on an individual item level:

	#From your Shopify admin, go to '''Online Store''' > '''Pages'''/'''Blog Posts'''.		# From your Shopify admin, go to '''Online Store''' > '''Pages'''/'''Blog Posts'''.
	#Click the name of the blog post/page to edit.		#Click the name of the blog post/page to edit.
	#In the '''Online store''' section, use the drop-down menu to select the template you've created to apply to the selected page.		#In the '''Online store''' section, use the drop-down menu to select the template you've created to apply to the selected page.
Line 130:		Line 131:
	#From your Shopify admin, click '''Online Store''' > '''Themes'''.		#From your Shopify admin, click '''Online Store''' > '''Themes'''.
	#Find the theme that you want to edit, and then click '''Customize'''.		#Find the theme that you want to edit, and then click '''Customize'''.
	#Open the dropdown menu at the top of the page.		# Open the dropdown menu at the top of the page.
	#Use the dropdown menu to select a template.		# Use the dropdown menu to select a template.
	#In the sidebar, click '''Change'''.		#In the sidebar, click '''Change'''.
	#Select the product or page you want to preview with the selected template.		#Select the product or page you want to preview with the selected template.
Line 137:		Line 138:
	===Delete a template===		===Delete a template===

	If you want to delete a template that you created using Easy Content Builder, here are the steps:		If you want to delete a template that you created using Easy Content Builder, here are the steps:
	* From your Shopify admin, click Apps > '''Easy Content Builder'''.		*From your Shopify admin, click Apps > '''Easy Content Builder'''.
	* From the Easy Content Builder dashboard, click '''Manage Templates'''.		*From the Easy Content Builder dashboard, click '''Manage Templates'''.
	* Then select the template that you want to remove and click '''Delete'''.		*Then select the template that you want to remove and click '''Delete'''.

	[[File:Manage template delete.png\|1200x1200px]]		[[File:Manage template delete.png\|1200x1200px]]
Line 147:		Line 148:

	======Manage and edit your templates======		======Manage and edit your templates======
	* Manage your templates: [[Manage Templates\|follow these steps]].		*Manage your templates: [[Manage Templates\|follow these steps]].
	*Edit your template: [[Edit Template\|follow these steps]].		*Edit your template: [[Edit Template\|follow these steps]].

	======Set up multi-column layouts======		======Set up multi-column layouts======
	*Learn how to set up multi-column layouts:		*Learn how to set up multi-column layouts:
	::*[[Section Settings\|1-col boxed layout]]		::*[[Section Settings\|1-col boxed layout]]
	::*[[Section Settings\|1-col with Background Image]]		::*[[Section Settings\|1-col with Background Image]]
	::*[[Section Settings\|2-col with Flexible Col Width]]		::*[[Section Settings\|2-col with Flexible Col Width]]
	::*[[Section Settings\|2-col with Blank Sections]]		::*[[Section Settings\|2-col with Blank Sections]]
	::* Hierarchical Grids ([https://posstack.com/blog/easy-content-builder-new-hierarchical-grids 6 layout options])		::*Hierarchical Grids ([https://posstack.com/blog/easy-content-builder-new-hierarchical-grids 6 layout options])
	:::{{note\|We suggest you install the '''Theme Section Kit''' to customize your Shopify theme faster. This template contains prebuilt sections (Free and Pro versions) that you can edit, reorder, or hide through your Theme Editor. Preview the '''Theme Section Kit''' [https://easy-content-builder-demo.myshopify.com/pages/ecb-prebuilt-theme-sections here].\|info}}		:::{{note\|We suggest you install the '''Theme Section Kit''' to customize your Shopify theme faster. This template contains prebuilt sections (Free and Pro versions) that you can edit, reorder, or hide through your Theme Editor. Preview the '''Theme Section Kit''' [https://easy-content-builder-demo.myshopify.com/pages/ecb-prebuilt-theme-sections here].\|info}}