WordPress Gutenberg Editor Ultimate Plug in Spectra

Spectra yes WordPress Gutenberg Editor Ultimate plug-in, original name Ultimate Addons for Gutenburg (UAG) is the ultimate plug-in specially developed for Gutenberg Editor. along with Release of WordPress 6.0 , foreign developers are paying more and more attention to the development of supporting plug-ins for Gutenburg editor.

Elementor Page Editor The more powerful the function of, the more bloated. The advantage of Gutenburg editor is that there is less code, and the fewer resources of finished web pages means that the opening speed is fast. This is also in line with Google SEO optimization requirements.

What is Gutenberg Block

Gutenberg Editor is a page editor built into WordPress 5.0 to design websites.

Spectra Installation Enable

Spectra is permanently free of charge. It is designed by the same development team as the Astra theme.

Spectra is installed in WordPress as a plug-in 。 In WordPress>Plug in>Install Plug in, search for Spectra, install and enable it.

The name you see after the installation is Ultimate Addons for Gutenberg, that is, Spectra.

Basic composition of Spectra

Spectra provides a variety of station building forms. It includes blocks, pages, patterns, and wireframes.

The basic unit blocks of Spectra block and Gutenberg editor are the same. In the page editing area, click Add and select the appropriate block to add to the page.

There are dozens of Spectra blocks available at present, as shown below:

• Creative block: popular icon list, marketing button, content schedule, release timeline, Lotti animation, multi button
• Content block: popular information box, advanced title, tag, call to action, classified list, price list, team, inline notification
• Social blocks: social sharing, testimonials, Google Maps, stars, block references
• Publishing block: popular post layout, post masonry, publishing timeline
• Form blocks: Contact Form 7 Stylist, Contact Form, Gravity Forms Stylist

It basically includes our common and commonly used block types and is increasing.

Now let's talk about three layout forms of Spectra: page, mode and wireframe.

Open an article page or page editing status, click UAG Templates on the toolbar to enter

Pages

It is a designed complete page, commonly known as a single page template.

There are page templates for different themes, such as outdoor adventure, mountains, organic stores, etc. The number is increasing.

Clicking any group displays all single page templates related to that topic. When all individual pages in a group are put together, a complete website can be formed.

For example, when you open Outdoor Adventure, you can see five single page templates - Home About、Services、Projects、Contact。 All of these single page templates have the same design theme.

Add five blank pages in WordPress and import the five single page templates in turn, and you will have a complete website containing all the pages.

The next task is to add/replace your own content and replace images. After that, the website can go online.

Is it very simple?

Patterns

A special part designed for different parts of a web page. You can add patterns to your design or use different patterns to create unique pages.

Find the designed pattern in the library

• about
• Call for action
• customer
• Contact
• Frequently asked questions
• features
• title
• Hero part
• folder
• statistical data
• service
• team
• witness

Specific usage of mode:

Importing patterns into the layout of a page can meet some of the requirements on the page.

For example, there is a sales page where you want to add a FAQ section to the product. The main purpose is to solve user problems and encourage completion of purchase. Import the FAQ section from Patterns and add your own text and picture content. In this way, you can quickly create the FAQ section, thus saving your time and energy.

The mode can switch between dark mode and light mode. Lao Wei usually uses light mode.

Similarly, you can use different modes anywhere on the page.

After importing the page/mode, you need to pay attention to the following points:

• After importing the page or mode, you may see some colors and layouts different from the preview content. This is because the custom settings are automatically inherited to the page/mode. For example, the imported page has a black button, and you set a yellow button in the customizer. After importing the page, the button is yellow instead of black.
• Similarly, typesetting and layout will be inherited from the customizer, including the title and content.
• If the imported page has forms, the required plug-ins will be automatically installed and activated.

Wireframes

It is a set of ready-made WordPress blocks that can be quickly imported and created in the WordPress block editor.

Suppose you want to create a homepage for the website. You need a banner at the top, an introduction, a presentation of the services provided, a team introduction, some user recommendations, CTA, etc.

Wireframe blocks have different categories, which can meet the needs of each part of the website, such as About, Team, Recommendation, CTA, FAQ, etc.

A specific wireframe block has many independent elements, such as title, text, image, and button. These are placeholders. It is perfect to add/replace your own images, text and colors after importing.

The method for adding wireframes is exactly the same as the above [Mode], which includes dozens of wireframes often used for building websites. At the same time, it also provides dark mode and bright mode.

Spectra Settings

After installing Spectra, a Spectra setting item is provided in WordPress background>Settings, which provides the following functions:

• Enable/pause any Spectra block
• Enable Beta Update
• Rollback to Previous Versions
• Other visible supporting functions and products

Later, Spectra 2.0 will be introduced to enable novices to build sites as fast as manual coding without going through complicated operation steps.

Each block is beautifully made, and the website is not only attractive but also very fast after being imported.