Euphony Blocks

How to install theme?

You can download Euphony Blocks free theme through Dashboard > Appearance > Themes > Add New > Euphony Blocks. Simply click on the ‘Install’ button and wait for a few seconds to ‘Activate’ the theme.

Frequently Asked Question

Before starting please visit our Frequently Asked Question link, to know more about Full Site Editing Themes

How to Open Site Editor?

If you are on WordPress Dashboard then go to “Appearance -> Editor” to open the Site Editor.

If you are on Site Front-End then you will see WP Admin Bar on the top of the page, click on “Edit Site” to open the Site Editor.

Add and Edit Menu

You can Select predefined menu and create you own customized menu.
Go to this link for Navigation Block

1. This Video show how to create your own custom menu:

2. This video shows how to select predefined menu:

Site Navigation Menu

Please visit this link for Navigation Block. You can edit existing menu or create a new one.

How to work with Euphony Blocks Blocks and Patterns

After opening site editor, there are 3 ways you can add Blocks and Pattern in you website:

There are three ways to add a block using the Block Inserter (+) icon.

1. Click on the Block inserter (+) icon in the top toolbar and Click on Patterns. Browse the Patterns and select the one that you like to add.
2. Click on the Block inserter (+) icon to the right of an empty block, after that Click on the Browse All button, and finally Click on Patterns. Browse the Patterns and select the one that you like to add.
3. Click on the Block inserter (+) icon in between blocks, after that Click on the Browse All button, and finally Click on Patterns. Browse the Patterns and select the one that you like to add.

Once the section is selected you can edit its content or if you want to customize the section’ properties/options, click the three dots and select your desired action. Duplicate, Remove, Copy or Add desired section before or after the current section.

Go to this link to know more about adding blocks and patterns

How to Edit Pattern Content?

First, click on the pattern content you wish to edit/customize
You can select the section/content in three ways

1. Clicking on the section itself
2. List View
3. Footer Interface Bar

Once the section is selected you can edit its content or if you want to customize the section’ properties/options, click the three dots and select your desired action. Duplicate, Remove, Copy or Add desired section before or after the current section.

Patterns in Euphony Blocks

Patterns in Euphony Blocks are predefined list of in built sections. Patterns are built with different type of blocks.

You can easily add patterns in any part of your website. You will just have to click on ‘+’ sign on top left of your page or post, then you will see tab for “Pattern” click on that to see list of patterns. Under Scroll Down you will find “Euphony Blocks” which will display list of our Euphony Blocks pattern

Pattern are group of blocks. Once a pattern is added in editor, they are now individual blocks that can be moved edited or replaced. The pattern stops being pattern as soon as it placed in the editor. The content of patterns are always saved even if the users switches theme. It might look different in different themes.

There are 28 Patterns in Euphony Blocks.

Here is the list of Patterns Euphony Blocks supports including patterns from FSE Pro Plugin.

1. 404 Header
2. Archive Header
3. Blog Header
4. Cart Header
5. Checkout Header
6. Featured Content Two
7. Footer Default
8. Footer Three Columns
9. Footer
10. Header Media
11. Header Normal
12. Header With Banner
13. Header
14. Hero Content
15. Hidden 404
16. Hidden Archive
17. Hidden Post
18. Hidden Search
19. Music Playlist
20. Order Confirmation Header
21. Portfolio – Cover
22. Post Header
23. Recent Blog Posts
24. Search Header
25. Services Default
26. Shop Header
27. Sidebar Products
28. Sidebar

Header Patterns

There are 13 different headers provided by Euphony Blocks. Here are the list of headers. You can choose header according to your need.

1. Header
2. Header Media
3. Header Normal
4. Header With Banner
5. 404 Header
6. Archive Header
7. Blog Header
8. Cart Header
9. Checkout Header
10. Order Confirmation Header
11. Post Header
12. Search Header
13. Shop Header

Here is how you add header to website:

1. Click on “+” sign on block pattern tab to display Blocks and Pattern, Click on Pattern
2. Click select “Euphony Blocks” to see list of pattern provided by Euphony Blocks
3. Scroll down to find 10 different type of header(mentioned above) or type “Header” in Search box, click to add desired header or drag and drop
4. After adding header, Click on Top left setting icon there you can edit the sections
5. Edit Header Accordingly you can add, images, text, cover and so on
6. Finally, click “Save” to save changes

Header Media

Euphony Blocks supports Header Media pattern, using this pattern you can add image in your header area along with featured image, button, header media text.

Here is how you edit header media:

1. Click on “+” sign on block pattern tab to display Blocks and Pattern, Click on Pattern
2. Click on dropdown menu and select “Euphony Blocks” to see list of pattern provided by Euphony Blocks
3. Scroll down to find “Header Media” or type “Header Media” in Search box
4. Click to add or drag and drop in desired area
5. Click on the content of header media itself to replace images, text and button. You can add and replace header media such as image, text, link as per your need
6. Finally click on Save to save changes

Music Playlist

Euphony Blocks supports Music Playlist pattern, this pattern allows you to display the your music playlist to your audience in the most amazing way possible. By default it will load the Playlist Cover, Title, Description and sample music. You can edit all those as per your need.

Here is how you add Music Playlist:

1. Click on “+” sign on block pattern tab to display Blocks and Pattern, Click on Pattern
2. Select “Euphony Blocks” to see list of pattern provided by Euphony Blocks
3. Scroll down to find “Music Playlist” or type “Music Playlist” in Search box
4. Click to add or drag and drop in desired area
5. Edit Music Playlist, you can add/edit, images, text, music, button and so on
6. Finally click “Save”, to save changes

Hero Content

Euphony Blocks supports Hero Content pattern, this pattern allows you to display the best assets of your website to your audience in the most amazing way possible. So, you can set the media and words side by side for a richer layout. Also, add the title, tagline, content, and button for the section. Display your best assets and customize them the way you want.

Here is how you add Hero Content:

1. Click on “+” sign on block pattern tab to display Blocks and Pattern, Click on Pattern
2. Select “Euphony Blocks” to see list of pattern provided by Euphony Blocks
3. Scroll down to find “Hero Content” or type “Hero Content” in Search box
4. Click to add or drag and drop in desired area
5. After adding hero content, Click on Top left setting icon there you can customizer various section such as Media Setting, Overlay Opacity, Typography, Dimensions of your choice
6. Edit Hero Content Accordingly you can add/edit, images, text, cover, button and so on
7. Finally click “Save”, to save changes

Services

Euphony Blocks supports Services pattern. Services allows you to display your services.

Here is how you add Services Default:

1. Click on “+” sign on block pattern tab to display Blocks and Pattern, Click on Pattern
2. Select “Euphony Blocks” to see list of pattern provided by Euphony Blocks
3. Scroll down to find “Services Default” or type “Services Default” in Search box
4. Click to add or drag and drop in desired area
5. Edit Services Accordingly you can add/edit, images, text, links, and so on
6. Finally click “Save”, to save changes

Portfolio

Portfolio Patterns allows you to display your Portfolio. Here is how you add Portfolio:

1. Click on “+” sign on block pattern tab to display Blocks and Pattern, Click on Pattern
2. Select “Euphony Blocks” to see list of pattern provided by Euphony Blocks
3. Scroll down to find “Portfolio” or type “Portfolio” in Search box
4. Click to add or drag and drop in desired area
5. By Default, it will load Portfolio Title and Recent Posts, then you can edit those as per your need
6. But if you want to change the Portfolio Type, then Click on “Query Loop” and from the Settings panel, change the “Post Type”.
   
7. Finally click “Save”, to save changes

Footer Patterns

Footer Patterns allows you to display Footer content. Euphony Blocks supports 3 Footer patterns.

1. Footer
2. Footer Default
3. Footer Three Columns

Footer Default

The Footer Default pattern allows you to insert a section that you can display footer 3 columns content and footer copyright. In the pattern, by default, there are three columns and you can use the columns to add quick information, useful links, recent posts, your contact info including your social icons, and also footer copyright content.

1. Click on “+” sign on the top bar to display Blocks and Pattern, Click on Pattern
2. Select “Euphony Blocks” to see list of pattern provided by Euphony Blocks
3. Scroll down and to find “Footer Default” or type “Footer ” in Search box
4. Click to add or drag and drop in desired area
5. Edit Footer accordingly by changing text, social links, add recent posts
6. Finally click Save, to save changes

How to to duplicate sections?

Duplicate section can be used if you want add similar section in your pattern.
For Example: If you want to add one more column in between your Featured Content Duplicate section can be used, as it will create similar section and you can edit the content accordingly.

Duplicate section is very easy step to add on particular sections in your pattern. It can be done in two ways via Clicking on content or Table of content (List View)

1. Step of Duplication By Clicking on content:

1. Add the desired pattern, then click on the section you want to duplicate
2. Click on the section you want to duplicate, after clicking tool bar will open and click the three buttons
3. After clicking on the three dots menu on the tool bar, click on the “Duplicate” option to replicate your desired section or design
4. Edit the section accordingly
5. Click on “Save” button to save your changes

2. Steps of Duplication by using List View

1. Add the desired pattern, then click on the section you want to duplicate
2. Open the “List View” tab from top tool bar, to open the table of content
3. Scroll down to the section that you want to duplicate
4. Click on three dots menu and select “Duplicate” option to replicate your desired section or design
5. Edit the section accordingly
6. Click on “Save” button to save your changes

Templates in Euphony Blocks

You can find 19 Templates provided by Euphony Blocks. You can customize these templates if you feel like changing anything on a certain template and wish to see those changes across your site.

1. All Archives
2. Archive Product
3. Blank
4. Blog Home
5. Checkout
6. Front Page
7. Index
8. Order Confirmation
9. Page: 404
10. Pages
11. Product Search Results
12. Products By Attribute
13. Products By Category
14. Products By Tag
15. Search Results
16. Single Page (No Sidebar Full Width)
17. Single Post (No Sidebar Full Width)
18. Single Posts
19. Single Product

Editing Templates

1. From your WordPress Dashboard, go to “Appearance => Editor”
2. Click on “Templates => Euphony Blocks”, it will load all Templates
3. Now, you can use the Search Bar to search for any above mentioned template or just scroll to view existing template
4. After searching the template, click on it to load that template on Editor. Template consist of Template Part, Patterns and Blocks
5. If you want to see the List of Template Part, Patterns and Blocks used in the template, then click on “List View” panel. From this, you can click on the Element that you want to edit
6. Now, you can edit the desire elements and after all the changes click on “Save” button

Front Page

Euphony Blocks Supports Front Page template, this template is used to display static Front Page.

1. From your WordPress Dashboard, go to “Appearance => Editor”
2. Click on “Templates”, it will load all Templates, then in Search Box type “Front Page”
   
3. Click on “Front Page” template and will load the Front Page template
4. If you want to see the List of Template Part, Patterns and Blocks used in the template, then click on “List View” panel. From this, you can click on the Element that you want to edit
   
5. If you want to see the Settings of each blocks then you can click on “Settings” panel
6. Now, you can edit the desire elements and after all the changes click on “Save” button
7. Note: This template consist of Template parts like Header (with Banner”), Footer. So, if you edit block on those section then it will also update those template parts as well

Template Parts in Euphony Blocks

There are 11 Template Parts in Euphony Blocks.

1. Header
2. Page Content
3. Header Normal
4. All Products
5. Post Content
6. Header (With Banner)
7. Footer
8. Footer Default
9. Footer Three Columns
10. Sidebar
11. Sidebar Products

Editing Template Parts

1. From your WordPress Dashboard, go to “Appearance => Editor”
2. Click on “Patterns => All template parts”, it will load all Template Parts
3. Now, you can use the Search Bar to search for any above mentioned template parts or just scroll to view existing template parts
4. After searching the template parts, click on it to load that template parts on Editor. Template Parts consist of Patterns and Blocks
5. If you want to see the List of Patterns and Blocks used in the template parts, then click on “List View” panel. From this, you can click on the Element that you want to edit
6. Now, you can edit the desire elements and after all the changes click on “Save” button