Site icon Catch Themes

Catch FSE

Sakin

Video Tutorial

Patterns in Catch FSE

Patterns in Catch FSE 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 “Catch FSE” which will display list of our Catch FSE 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.

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 Frontend then you will see WP Admin Bar on the top of the page, click on “Edit Site” to open the Site Editor.

Inserting/Adding Catch FSE Patterns

Dashboard -> Appearance -> Editor -> ‘+’ Toolbar (Top Left) -> Patterns -> Select Catch FSE from the drop down menu -> Add/Insert Catch FSE Patterns accordingly

Editing Pattern Content

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

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 the desired section before or after the current section.

How to Set a Static Homepage (Demo Website of Catch FSE Theme)?

To set Homepage and blog pages with sidebar left or right as in demo, follow these steps.

On WP Admin Dashboard – Settings – Reading – Your homepage displays set following:

Note: Setting a page on Blog Page and setting template as “Blog Page (Sidebar on Right)” or “Blog Page (Sidebar on Right)” will not work for blog page. Leave it empty for Blog page templates to take effect.

Edit Header

You can easily edit header and its content such as site title and tagline, change logo, add/remove CTA Buttons and so on.

Here is how you edit header:

How to replace Header Template Part?

Catch FSE comes with two template parts for header, header with buttons and header

Here is how you replace header template part:

How to edit header template parts?

You can edit and customize header template parts according to your requirement.

Here is how you edit header template parts:

Add and Edit Menu

You can Select predefined menu or create you own customized menu. Here are 2 ways you can add and edit menu.

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

2. This video shows how to select predefined menu:

Theme Style

Catch FSE has different styles for certain blocks along with WordPress default style. You can choose “Theme Style” for unique styles provided by Catch FSE.
Currently Catch FSE supports different Theme styles for post-author, button, post-comments, quote, pullquote, table and latest comment.
To achieve theme’s style watch this video as example:

  1. After adding desired block theme style can be chosen via two method
  2. First Method: Click on the block and you will see a tool bar click on the first one to display style, click to achieve the style
  3. Second Method: Click on setting button on top left to select theme’s Theme style
  4. Finally Click “Save to Publish”

Duplicating the designs and sections for patterns having more than one column

Duplicate section can be used if you want to add a 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 a similar section and you can edit the content accordingly.

Duplicate section is a very easy step to add on particular sections in your pattern.

Select the column via List View / Footer Interface, then click on three dots and select Duplicate then change the content accordingly

Here are the list of patterns Catch Fse Supports and steps how to add it in your website:

About US

Catch FSE support About us section. Here is how you add it to your website:

  1. Click on “+” sign on the top bar to display Blocks and Pattern, Click on Pattern
  2. Click on drop-down menu and select “Catch FSE” to see list of pattern provided by Catch FSE
  3. Scroll down and to find “About Us”, click to add about us on your website
  4. Edit Header Media Accordingly

Header Media

Catch FSE support Header Media here is how you add header media to your website:

  1. Click on “+” sign on block pattern tab to display Blocks and Pattern, Click on Pattern
  2. Click on drop-down menu and select “Catch FSE” to see list of pattern provided by Catch FSE
  3. Scroll down and to find “Header Media”, click to add header media on your website
  4. Edit Header Media Accordingly

CTA (Call to Action)

CTA is call to action section. You can add a cover image with a text overlay to make the section attractive. Add in your title, description, and a responsive button to make the section effective.

  1. Click on “+” sign on the top bar to display Blocks and Pattern, Click on Pattern
  2. Click on drop-down menu and select “Catch FSE” to see list of pattern provided by Catch FSE
  3. Scroll down and to find “CTA”, click to add about us on your website
  4. Edit CTA Accordingly by adding Title, Descriptions button and button links

Featured Content

Featured Content pattern and customize the section. Add your Title, Tagline, and Subtitle for the section. Display your featured content in as many columns as you wish and customize color, border, styles, and more.

  1. Click on “+” sign on the top bar to display Blocks and Pattern, Click on Pattern
  2. Click on drop-down menu and select “Catch FSE” to see list of pattern provided by Catch FSE
  3. Scroll down and to find “Featured Content”, click to featured content on your website
  4. Edit Featured Content accordingly by adding Title, Descriptions button and button links

Footer Three Columns

The Footer Three Columns pattern allows you to insert a section that you can display right above your default footer. In the pattern, by default, there are three columns and you can use the columns to add quick information and also your contact info including your social icons.

  1. Click on “+” sign on the top bar to display Blocks and Pattern, Click on Pattern
  2. Click on drop-down menu and select “Catch FSE” to see list of pattern provided by Catch FSE
  3. Scroll down and to find “Footer Three Columns”, click to add Footer Three Columns on your website
  4. Edit Footer Three Columns accordingly by changing text, social links, contact form, add recent posts

Footer Default

The default Footer pattern allows you to insert a basic footer section on your site. On the Default Footer pattern, you can add an editable Copyright text and also a responsive navigation menu as well.

  1. Click on “+” sign on the top bar to display Blocks and Pattern, Click on Pattern
  2. Click on drop-down menu and select “Catch FSE” to see list of pattern provided by Catch FSE
  3. Scroll down and to find “Footer Three Columns”, click to add Footer Three Columns on your website
  4. Edit Footer Default accordingly by editing default copyright text

Recent Blog with sidebar

If you wish to add a section on your site where you can showcase your latest articles list along with a responsive sidebar, then the Recent Blog with Sidebar pattern serves you well. Your latest blog posts will be displayed nicely in this section along with a right sidebar.

  1. Click on “+” sign on the top bar to display Blocks and Pattern, Click on Pattern
  2. Click on drop-down menu and select “Catch FSE” to see list of pattern provided by Catch FSE
  3. Scroll down and to find “Recent Blog with sidebar”, click to add Recent Blog with sidebar on your website
  4. Edit Recent Blog with sidebar accordingly

Reset to Default

If you want to restore default template and clear your customization.
Click on top of page and click on Clear Customization, (This option will be shown only if any changes are made in the default template)

Here is how you reset to default:

Templates in Catch FSE

You can find 15 Templates provided by our Catch FSE theme. 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. Front Page: The template is displayed as the site’s static homepage.
  2. 404: The template is displayed when the requested resource or content is missing and cannot be found.
  3. Archive: The template is displayed for post categories, tags, and other archives.
  4. Blank: The blank template can be used for displaying the contents of a post or page.
  5. Home: Displays as the site’s home page, or as the Posts page when a static home page isn’t set.
  6. Index: The template is used for displaying posts.
  7. Page: The template displays a single page.
  8. Search: The template displays search results.
  9. Single Page (No Sidebar Full Width): Displays single page in full-width layout without sidebar.
  10. Single Page (Sidebar on Left): Displays a single page with a sidebar on the left side of the site.
  11. Single Page (Sidebar on Right): Displays a single page with a sidebar on the right side of the site.
  12. Single Post (No Sidebar Full Width): Displays a single post in a full-width layout.
  13. Single Post (Sidebar on Left): Displays a single post with a sidebar on the left side of the site.
  14. Single Post (Sidebar on Right): Displays a single post with a sidebar on the right side of the site.
  15. Single Post: Displays a single post.

Template Parts

Template parts can be used to organize and add structure to the theme to avoid having to repeat code. You will start with a header and footer and will combine them with the template files.

Exit mobile version