If you’re like me, I’m sure you don’t want to waste any more time on Twitter, Facebook, LinkedIn… promoting your content. Use Nelio Content instead and let it do the hard work for you! Take a look at it!
The new WordPress editor, Gutenberg, comes installed by default from WordPress 5.0 version. It is an editor that radically changes the making of posts and pages of a website, being much closer to other visual editors. Now, a post or page is made up of content blocks. You have blocks for paragraphs, for images, for headers, for appointments, and much more.
This course is not intended to be a Gutenberg user manual. Its aim is to teach how to create new posts and web pages in a practical and efficient way. And that’s why over 2 hours of videos, divided into 20 lessons, you’ll learn to master WordPress editor environment. But you’ll also learn many details of the process we follow in Nelio when we write a new post or create a new page.
You will see how, thanks to the possibilities offered by this editor, you can design a large number of elements or sections that you can find in our web pages or any other professional website. You no longer need to be a designer to layout your content with skill and style. You can do it yourself with the catalogue of content blocks that WordPress includes by default.
The course is divided into 3 parts:
In the first part we will see the novelties that this editor brings us and the differences between the classic editor and the block editor. Get used to its new environment, its interface, and where to find the different toolbars, and learn the basic about the information and properties of the different blocks you can use.
Next we will see the process of writing a post, to which we will add the most common elements of blog posts: headings, images, paragraphs, lists, quotes, verses or videos. You’ll also learn tricks to master the editor and gain efficiency.
Also, as you know, before publishing any post you must make sure that you don’t forget the information needed to improve search engine rankings and its promotion on social networks. For that reason, we also explain how the new editor integrates with Yoast and Nelio plugins. And so you become familiar with the integration of any plugin with the editor too.
In page design lessons, you’ll learn the basic process to follow before you start creating any page of your website. And we’ll continue to see another new set of blocks that are particularly useful in page design: cover, media and text block, columns, design elements, image gallery, and widgets. For each of them, you will see practical and real examples that will serve as an idea on how to create new sections in your web pages. And you’ll even learn how to combine blocks in a way that nobody has ever explained before, opening a new range of design possibilities.
And of course, we will finish the design of the pages learning how to create and use reusable blocks, a feature that comes very handy to gain efficiency in the design of new pages.
Here is the list of lessons that make up the course:
All the lessons show practical and real examples for immediate application on your website.
If only I had a calendar where I could schedule all my upcoming posts… Hold on a sec, I do have one! And it even helps me to promote it on social networks! Discover our new plugin!
We don’t like to wait. If people have to wait when visiting your website, they’ll get tired of it and will go visit another one. Your web loading fast is an essential requirement nowadays. But how can we know if a website is slow or fast?
I know, this question seems a bit stupid. You can know whether a web is fast or slow by measuring its loading time, duh. The difficult thing is to know if the value resulting from this analysis can be classified as “slow” or “fast”. Waiting 2 seconds may not be a problem, but if my website loads in half the time, that would be absolutely better, wouldn’t it? Specially if you take into account things like your website might only take 2 seconds to load on your Internet connection, but what about those who hve slow connections?
All this is a more complex problem than it may seem at first. In order to establish comparable measures, there are evaluators of the optimization level of the websites, such as Google PageSpeed Insights or GTMetrix, just to mention a few.
These evaluators are able to analyze a web page and give it a grade on a scale of 0 to 100 depending on its level of optimization. In addition, they detect the characteristics of the web and indicate suggestions that we can carry out to improve its grade and, supposedly, its speed.
However, seeking perfection can be counterproductive. Searching for excellence in Google PageSpeed Insights can neglect other aspects of your website that are also important, such as the user experience.
Searching for Excellence in Google PageSpeed Insights
We have recently rewritten the theme of our website from scratch and have transformed all of our pages using blocks from the new WordPress block editor. It has been an exercise to better understand the characteristics of the block editor and also see their shortcomings, learning by doing.
Taking advantage of this task, we have analyzed our website with Google PageSpeed Insights to try to improve its final grade and get as close as possible to the desired 100. Next we will see some of the points that we have been improving thanks to the indications of Google and our conclusions about it.
Use an appropriate size for the images
We have already discussed this topic in our blog. Remember that you should try to use image sizes compatible with what your theme needs. Don’t use giant images because they are not necessary.
If Google PageSpeed Insights complains about your images, the good thing is that it will tell you what images cause the problems so you can fix them. It is a laborious work to do but whose results have a direct impact in the loading time of your web.
Postpone the load of images that do not appear on the screen
For all those images of your page that to be seen the visitor has to scroll down, what is recommended is to apply lazy loading.
What you get by using lazy loading is that you only ask the server for an image when the visitor scrolls and needs to see it. In this way we avoid overloading the server in the initial request and reduce time, making the web load faster. I recommend you this article about it. If you want to use a plugin for lazy loading, maybe this one will help you.
In our case, the SiteGround optimization plugin includes lazy loading, so we didn’t need anything else to activate this technique on our website.
Make sure the text remains visible while the web font is loading
If you use Google Webfonts, as we do, it is ironic to check how the script that Google gives you to load the fonts is detected by Google PageSpeed Insights as improvable.
According to Google, you should use the CSS font-display in @font-face for users to see the text while loading the web font. In particular, you must put font-display:swap in the loading of the fonts so that the browser does not block the rendering of the text until the font is available. You can download Google fonts and import them directly using font-display as explained here.
With this the visitor is able to see the text from the beginning, even if the specific font by Google is not loaded. At the moment in which the font becomes available, the browser will apply it to the text, transforming its style to the desired one.
Remove resources that block rendering
One option to avoid this is to move these files to the <footer> of the web. By doing this, all the content that goes in the <body> will load and render first, without being blocked.
You can use this plugin to get better results, but again, use it carefully.
Downsides of Improving the Speed of Your Website
After applying solutions to the suggestions proposed by Google using the Google PageSpeed Insights reports, the loading time of the website is reduced. However, this has a price that it is not clear if we want to pay.
One of the side effects of lightening our website is that the user experience a visitor gets might not be as good as it was. Let me further elaborate …
Before, in a common WordPress installation, the visitor saw the web load without any problem. Now he will see that it loads a little faster, but all this flickering that he experiences reduces the user experience and it is possible that it makes the visitor think that the web is loading weirdly. Or even that something is broken on the web because every time you navigate to a page the flickering appears for a moment.
Is it worth providing this weird feeling to visitors just to win a handful of milliseconds in loading time and a few extra points in the Google PageSpeed Insights? We don’t think so. And for this reason we have return to the common way of loading styles and scripts that WordPress does by default.
Whether or not this has a negative effect on other aspects, such as SEO, the truth is that we don’t know (and we do not believe anyone knows for sure). Nor are we clear if the evaluation of Google PageSpeed Insights has as much weight as some people believe.
Don’t go crazy with the evaluators of the optimization of your website and with getting the maximum score. After all, your target visitor is made by flesh and blood, unable to appreciate minimum differences in tenths of a second. Once your grade is mostly correct, focus on something else.
I was very tired of promoting my posts on social media… until we created Nelio Content, a WordPress plugin that makes it soooo easy I can’t even believe it! Check it out!
The new WordPress block editor (also known as Gutenberg) is a radical change for developers used to working with PHP.
The most important arguments discussed in the presentation are the following:
We have developed a boilerplate to facilitate the adaptation process to WordPress developers. This plugin establishes a foundation for the programming on the block editor including a complete initial configuration for the modern build process.
Gutenberg provides a lot of reusable components to create user interfaces in JSX. A good practice is to use existing components, instead of programming them from scratch and reinventing the wheel.
The registerBlockType function is the most popular one in Gutenberg. It provides the ability to create new blocks in the editor. But there are many more functions that are worth exploring.
The registerPlugin function allows you to add a plugin that extends the editor with a sidebar in which to add the components you want.
The subscribe function allows you to listen to the changes that happen in the block editor and add your own functions that are executed every time a change occurs. You have to be careful and avoid unconditional code with this function to avoid affecting the final performance of the editor.
The following resources were mentioned during the presentation or are useful additional information.
WordPress Block Editor Boilerplate: base plugin used to extend the WordPress block editor (Gutenberg) with additional blocks or plugins for the editor itself. It includes examples and is well documented.
One of the things I like the most about WordPress is its plugin system–there’s a lot you can do! For instance, you can download and install our new plugin, Nelio Content.
Many external services that use the Google cloud require an API Key to work. But what is an API Key and how can you get one? This is what I’m going to explain you right now.
In this article we’ll see how to obtain an API Key to be able to use Google Cloud Translate, but the process is the same if we want to obtain an API Key for another Google Cloud service, such as Google Maps.
Lets start by the beginning… An API Key is nothing more than a string that we use as a license key for a particular service. In our example, a Google API Key will allow us to access any of Google’s cloud services from an external application. Without this key we can not make authenticated calls to Google Cloud services from a third-party application, and therefore the application that requires this key will not work.
Now that we understand what an API Key is, let’s see how to get one for Google Translate.
How to Create a New Account in Google Cloud Console
The first thing you need is an account in Google Cloud Console and a payment method in it. To do this, follow these steps:
Open the left side menu of the console and select Billing.
Click on the button New billing account. Keep in mind that if this is not your first billing account, you must first open the list of billing accounts. To do this, click on the name of your existing billing account near the top of the page and then click on Manage billing accounts.
Enter the name of the billing account and your billing information. The options you’ll see depend on the country of your billing address.
Click Submit and enable billing.
By default, the person creating the billing account is a billing administrator for the account. Once you have the account created and the billing information ready, you can continue with the following steps to obtain the API Key.
How to Create a New Project in Google Cloud
Go to the bar in the top of the window and in the drop-down you can see your created projects as well as the option to create a new one by clicking on the New Project button:
Now give the new project a name and create it by clicking on the corresponding button, as you can see in the following screenshot:
At this point you should already have the project created and selected, so let’s move on.
Activate the Google Translate API
Before you can use a Google API in your project, you have to activate it. Go to the side menu and select the APIs & Services option:
Now you will see a screen with statistics about the APIs that you have activated. If you created the project from scratch by following the steps above, you won’t have any data yet, as you can see:
Click on the upper button Enable APIs and services to continue with the activation process of the API. This takes us to a search box where we have to look for the API we’re interested in. In this case, we want to use the Google Translate API. Type translate in the search box and click on the result Cloud Translate API:
This brings us to a screen with the description of the Cloud Translation API. Click on the Enable button to activate the API in our project:
We already have the Google Cloud Translation API activated. We’re almost there…
Create a new API Key for Google Translate
After activating the API, let’s see how to generate a new Key API to be able to use this service. We have to go to the side menu again and select the Credentials option:
On this screen we see a button with a drop-down and the text Create credentials. Don’t click on the button! Instead, open the drop-down by clicking on the arrow to the right of the button and select the API Key option.
This creates the new Key API. You can copy it if you want, although you can access it later:
How to Restrict Our API Key to Protect and Limit Its Use
To control the cost of Google Cloud by using the Google Cloud Translation API (or Google Translate, which is the same), we can do two things: restrict where you can use the API Key that we just created or limit the allowed quota to use the service itself.
In the screenshot above, if you click on the Restrict Key button you will go to the API Key restriction screen that follows:
There you can select to restrict the API Key by HTTP referrers, which means that you can only make calls to the Google Cloud Translate API using the API Key from certain domain names.
You must add the valid domain names in the text box that appears when selecting the HTTP referrers option. In our case, we have added here our domain name https://neliosoftware.com/*.
On the other hand, go to the menu API’s & Services → Dashboard → Cloud Translation API → Quotas and there you will find a box called Characters. There you can modify the quota limits of the Google Cloud Translation API and reduce them, if necessary.
And that’s all! You already have your API Key ready to be used with the application you want. The process is a bit cumbersome at first, but following the steps you’ll get the API Key without problems. Try it and let me know if you need further assistance!
Are you spending too much time on social media? I used to, but not anymore. Nelio Content is saving my time from the very first day. Check it out by yourself!
When you learn a new programming language, the first thing you need to know is to understand its syntax. Only in this way can you start programming with it. Once you do this, you have everything ready to start creating.
JSBooks: if you are one of those who prefer to learn with books, here you have a lot of them for free.
Learn React and Redux
This is what everyone will tell you, but the truth is that it is not like that. You can develop for Gutenberg without having any idea of React or Redux. Of course, if you know how they work and what they are used for, then that would be better.
React and, above all, JSX
What you can not avoid is to know how the JSX syntax works to create elements within React, which we will use to define the interface of our components (whether they are Gutenberg blocks or views within the editor).
Imagine that you want to define the interface for the Product and ShoppingList components and then use them in a Gutenberg block. With standard notation you would do it in the following way, using the wp.element.createElement() function provided by Gutenberg:
On the other hand, if you use JSX within the render() method, which is nothing more than a notation similar to HTML, what you have is the following:
Using JSX simplifies writing and reusing components, since the code is much simpler and easier to read. As you can see, in the previous example we are creating React components without having any idea of React, by only knowing how to handle JSX and using it as if it were HTML with superpowers. In addition, you can also use existing components in Gutenberg. You can see them in this viewer that is also linked to the official documentation.
There is only one problem. You will need to transpile the code with Babel so that the JSX notation ends up transforming into regular code that any browser can interpret. However, this is not a drama since you can do it automatically by using WebPack.
Redux to Maintain The Status of Your Application
If you had the need to create your own data store, you would not do it with Redux, but you would use the @wordpress/data package included in Gutenberg. This package uses Redux internally, but that doesn’t matter. Also, we’re talking about a complex use case that you probably don’t need, at least in an initial stage. So for now forget about it.
NPM, WebPack, Babel, PostCSS, and ESLint
PostCSS: the same as Babel, but for your CSS stylesheets.
I already talked about most of these technologies here. However, I am going to write down another article soon, where I will explain how to integrate them into a WordPress development project so that you can use them in a real case.
How to Create New Blocks For Gutenberg
Now, let’s go for the most important part: what we need to start creating new blocks for the WordPress editor.
The first thing you need to start creating your own blocks is to master the function wp.blocks.registerBlockType() . You will find the most complete documentation on this function in the official Gutenberg guide.
The arguments for this function are a string with the name of the block, which must be unique, and an object with the configuration of the block, where the most important parts are the save and the edit functions of the block. I already briefly explained this to you in this article.
If this seems too complicated, you can start using Ahmad Awais toolkit called create-guten-block. This creates a folder structure with all the necessary dependencies to create your first block. You can see a tutorial on its use in the following video:
But I’m not going to explain it to you, I’ll let Mauricio Gelves do it. Go check his presentation on this subject in the WordCamp Zaragoza 2019 that you already have on WordPress.tv (in Spanish):
How to Extend the Block Editor in WordPress
There are many other things you can do with Gutenberg, in addition to creating new blocks. For example, you can create a plugin within Gutenberg to add a panel of options in the right side of the editor with everything you want. The best thing about this is that the official WordPress documentation includes this complete tutorial with concrete examples of what you can do there.
I recommend you take a look at the official documentation that you have in the Gutenberg handbook for developers and designers that you will find here. Take it easy because there is a lot of information and this is one of the best resources you have available.
Are you spending too much time on social media? I used to, but not anymore. Nelio Content is saving my time from the very first day. Check it out by yourself!
The 5.0 version of WordPress that was released on December 6, 2018 brought with it the block-based Gutenberg editor. With the new editor, every bit of content is a block. A paragraph, an image, a YouTube video, a table, etc, is a separate block. This new editing paradigm opens up new design possibilities for the creation of pages and entries, as Matt Mullenweg showed in WordCamp US 2018 (video minute: 9:50).
By default, Gutenberg comes with a fairly complete set of blocks that we could categorize into:
Text creation blocks for creating paragraphs, lists, headings, tables, and buttons.
Blocks for creating multimedia objects such as images, cover images, image galleries, audios, videos, embedded objects, and shortcodes.
Blocks for inserting quotations and verses.
Blocks for creating code and HTML.
Column format blocks and dividers.
Although Gutenberg organizes them using different categories. First it shows what it considers common blocks:
Then, the blocks that allow you to create different formatting:
And blocks for creating different layouts:
Blocks to add widgets:
And, finally, blocks to embed external objects:
Gutenberg comes with a lot of different block types, but you might still need some other blocks that aren’t included by default. That’s why you’ll find WordPress plugins that give you new blocks that make it easier to create posts and webs. Let’s take a look at some of them:
So, for example, with the Testimonial Block, in a flash you’ve already created a testimonial on your page:
#2 Kadence Blocks
The Kadence blocks plugin gives you 6 design blocks in which you can create your own design, but it also includes a library of pre-built variations.
So, for example if we take a look at the Row Layout you can define the row format you want to create:
But also you can go to the library of pre-built layouts and select the one you like best.
#3 Advanced Gutenberg Blocks
The Advanced Gutenberg Blocks plugin has been developed by Maxime Bernard-Jacquet and includes 15 additional blocks. With the following video you will get a quick idea of the capabilities of each one.
#4 Block Gallery
The Block Gallery plugin gives you three new blocks with which you can create three different ways to view image galleries.
Very easily (you only have to select the images) you can create a carousel gallery, or in Masonry format (optimally structured as when you are in Pinterest) or put the images stacked one below the other.
Bokez is a plugin developed by Delabon that provides you with 14 new blocks with which you can easily create a price table, easily show your latest entries, share on social networks, and so on.
#6 Advanced Gutenberg
The Advanced Gutenberg plugin, developed by JoomUnited includes more than 20 additional blocks to your editor. It also includes the possibility to control at user or user profile level which blocks can be accessed.
The CoBlocks plugin includes 10 new blocks in Gutenberg for market content professionals.
For example, the Author block allows you to quickly add a box with the author’s name, biography summary, a photo, and a button to follow him.
The Stackable plugin developed by Gambit Technologies is probably the one that gives you the most extra blocks: 24 and they keep increasing it.
And if you want to see a demo of a website built with its blocks, just visit their own website.
#9 Nelio Maps
If all you are looking for is a block to insert a beautiful Google map in your page or post, with the plugin Nelio Maps you already have it.
I was very tired of promoting my posts on social media… until we created Nelio Content, a WordPress plugin that makes it soooo easy I can’t even believe it! Check it out!
We start this New Year 2019 talking about the growth and usage statistics of WordPress. Knowing this information can help you to decide on which system to built your website or even convince a customer or your designer the time has come to renew your website.
Total Number of Domains, and Websites in The World
Do you have any idea how many domains and websites there are on the Internet? Difficult, isn’t it? But before talking about these numbers, it is better to clarify the differences between the concepts of domain name, URL, and website.
A domain name is the online address that your customers type when they want to find your business. It is the neliosoftware.com of the URL you see written in the address bar of this page.
Domain names were created as substitutes for the Internet Protocol of a website, or IP address, which is simply a unique set of numbers that identify the specific computer server where the website is hosted. It is much easier to remember a name than a string of random numbers. As a curiosity, the figures that have been paid for the 25 most expensive domain names range from $5 million to $25 million. 🤑
A URL is what you find in the address bar of any web page. It is the universal locator of any page. In the case of this page it is https://neliosoftware.com/blog/curiosities-and-statistics-about-wordpress-you-should-know/. As you can see, it includes the domain name.
Finally, when we refer to a website we mean to one or a set of related web pages that include multimedia content. A website can be publicly accessible over the internet or privately on a local network.
Now let’s go back to the figures that interest us about the number of websites, URLs, or domains that exist… unfortunately, there is no single official record that gives us this information.
The information that’s probably closer to reality is provided by Netcraft and Internet Live Stats. According to these, there are more than 1.9 billion websites in the world. And according to Verisign, who is dedicated to reviewing the state of the domain name industry through various statistical and analytical research, we ended 2018 with more than 350 million domain registrations of all top-level domains (TLDs).
And why is there such an abysmal difference between these two figures? For the simple reason that there are many domains that are divided into subdomains that correspond to different websites. For example, from the domain wordpress.com we have a lot of webs, such as https://pildorasdecomunicacion.wordpress.com/, https://lagottocattleya.wordpress.com/, https://worddreams.wordpress.com/ etc.
Now that we have an estimate of the total number of websites in the world as a point of reference, let’s see how many of them use a CMS (Content Management System). In case you are not familiar with what it is, a CMS is a system that is installed on a server (usually that of a hosting company) and generates web pages when any Internet user requests them, and can even generate dynamic content depending on the user. It has a public part that all Internet users see and a private section or control panel. It is through the control panel where the owner of the website can change the content without having programming knowledge.
According to W3Techs, 54.5% of websites use a CMS versus 45.5%, which uses none at all. As you can see, more than half of the websites use some kind of content manager.
But of the 54.5% of websites that do use some kind of CMS, 59.5% use WordPress, which is equivalent to 32.5% of all websites.
In other words, of all the websites, 32.5% are WordPress.
So, assuming that, as we’ve already found out, 1.9 billion sites of which 32.5% are WordPress, we deduct that there are 617.5 million WordPress sites in the world. And in fact these figures are not so far from those given by BuiltWith.com in which they have analyzed 1 million of the best websites that use a CMS, of which 53% are WordPress (below 59.5% of W3Tech).
There are several companies in the sector giving support to the foundation, including Automattic, the company of Matt Mullenweg (founder of WordPress) and owner of WordPress.com. There are thousands of people watching over the development of the WordPress core. But there is some recurring discussion about who exactly makes the decisions about what WordPress should look like. And if not, you’ll see that in the last WordCamp US in 2018, one of the questions Matt Mullenweg is precisely asked is whether he can clarify exactly who he refers to when he talks about “we” and who makes the decisions (minute 1:16:35 of the video WCUS 2018 State of the Word):
But let’s get on with interesting figures. As WordPress is a community in which we all contribute to its development and maintenance, promote its use, and sponsor events where we talk about it, this has allowed Matt Mullenweg to own one of the most profitable technology company.
Some other WordPress.com figures: about 409 million people see more than 21.2 billion pages each month. And there are more than 69.3 million new posts and more than 72 million comments every month.
You can also take a look at some of the most prominent WordPress users.
If we take a look at the WordPress versions that are installed on websites, in the middle of the last month of 2018 the most installed version was 4.9 with 59% of websites, and 5.0, recently launched, already had 9.8% of installations.
And if we look at the different languages in which WordPress is installed:
We can see that English (from Australia, Canada, South Africa, the United Kingdom and the United States) is installed in 52.1% of WordPress websites, followed by Japanese with 6% and then German and Spanish (from Chile, Mexico and Spain), both with 5.4%.
I would like to take this opportunity to comment that on the subject of languages, WordPress.org has 180 teams of volunteers in 45 locations who are dedicated to the translation of the core WordPress, themes and plugins. If anything is key in WordPress, it’s its community.
The WordPress Community
WordPress couldn’t be what it is today if you don’t consider its community. You’ve already seen the ratio of revenue versus the number of Automattic employees. And the quick question that comes to mind is why are so many people volunteering to contribute to the WordPress project? Of course, there may be an altruistic reason, but it’s not the only one. Those of us who contribute to WordPress usually work for companies that sell WordPress products or services (plugins, themes, web development, consulting, training, etc.). In other words, we earn our living thanks to WordPress and we are interested in the WordPress project growing to have more business opportunities.
Let’s look at some interesting figures related to the community:
Please note that in all WordCamps, both the organizers and the speakers are volunteers who do not charge anything for the work done.
And here you have to add the events related to WordPress that are for some niche market like Publishers, WooConf, LoopConf, WP Campus, and A Day of REST, as well as all the set of WordPress meetups that are organized locally to create local WordPress communities.
To give you an idea of the contribution that companies can make to the WordPress community, in 2018 the entire Nelio team was involved in the organization of WordCamp Barcelona 2018.
In the WordPress Directory you have free GPL licensed themes and plugins that can then have premium versions with paid functionalities or support services. The average price of a WordPress theme is less than $59 and prices can range from $10 to $200.
And what are the most popular WordPress themes?
According to BuiltWith, of the one million websites analyzed, the most popular WordPress theme is WooComerce’s own (25%), followed by Genesis and Divi (5%) each and Avada (4%).
With this incredible figure, the complex thing is sometimes to find the plugin you’re looking for. As long as you know that the two plugins, compatible with Gutenberg, that will help you promote your content and optimize the conversion of your website are Nelio Content and Nelio A/B Testing, respectively… you’re doing well… 😉
And precisely about plugins, Matt Mullenweg commented at WCUS 2018 that, with the aim of promoting Gutenberg, at this moment the plugins that were going to stand out the most in the directory are all those that offer blocks for the new block editor.
Surely as a WordPress user you don’t need to know all this information for your everyday, but they will help you understand and explain better that WordPress is not just a template or a little program to create a website; it’s something more, don’t you think?
I hate it when I waste my time doing the same tasks over and over again. That’s why we created Nelio Content, so neither you or I get stuck with boring stuff! Check it out!
More than once you’ve heard the phrase that creating a website in WordPress is very easy. Let’s not fool ourselves: creating a simple website is easy, but if you want some advanced stuff, it isn’t. If you also add plugins without knowing very well what you are doing, your website may be in a state in which you no longer know where you are.
Even hiring expert designers to create your website (by the way, it will surely be one of your best investments), the more knowledge you have of WordPress, the easier it will be for you to see all the possibilities you have, make your own changes, and make sure you really have the website you want. The more dynamic and updated your website is, the better it will be positioned in Google searches.
And if you do not have a great flexibility of time or your budget is limited, you are very lucky that you have many free resources to learn WordPress. You no longer have any excuse not to know about the subject.
Now; without further ado, here’s the list you’ve been waiting for:
The WordPress Codex isthe online manual for WordPress and a living repository for WordPress information and documentation. The WordPress Lessons area of the codex is a good starting point to understand WordPress and WordPress themes. Some of the articles are a little dated, but they remain relevant.
WPTuts is part of the PsmegTV group who provide free, high quality training videos on a range of software topics. WPTuts focuses on teaching how to use WordPress, Visual Composer, Slider Revolution, Elementor, and more.
WPBeginner offers a list of free resources with several types of content – written articles, videos, guides, and a useful glossary. If you are a beginner, this is a good starting point and the only requirement to access to all the information is to signup with your email address.
On First Site Guide video library you’ll find more than 40 short easy-to-follow video tutorials you need to set up and maintain a blog. Topics covered include WordPress, blogging basics, and niche blogging.
Do you want to drive more traffic to your web? So do I! That’s why we created Nelio Content, a new plugin that automates content promotion in social networks. Want to know more?
Are you increasing your web traffic and you have more and more followers in social networks? If so, congratulations! You seem to be on the right track, but… Are you getting your visitors to buy your services or products? Are you increasing your revenue?
If these questions have made you a little uncomfortable is that you need to increase the conversion rate of your website. That is to say, make more visitors of your web carry out those actions that you really want them to do. Forget about vanity metrics!
But how do we optimize our website to increase the conversion rate? First, don’t forget to perform A/B tests on your website that will provide you with real data about your visitors’ preferences at all times.
And, as I told you recently, create attractive lead magnets for your website visitors. Remember that lead magnets are attractive free offers that you offer to your readers, in exchange for them giving you contact information, subscribing to your newsletter or helping you to promote yourself.
So, in the same way that I explained to you 7 lead magnets ideas that you should try on your website to get more prospects and customers, today I will tell you about 3 plugins that will help you create lead magnets more quickly, that is, they will help you create opt-in forms, that invite your reader to subscribe to your newsletter in exchange for some attractive offer. For example, here is a lead magnet:
HOW TO SUCCEED
WITH YOUR BLOG
Join our Newsletter and get the course lessons straight to your inbox to take your blog to the next level
Before you continue reading, the three plugins I’m telling you about below are premium plugins, they are not free. The functionalities they offer compensate for their cost. And it’s also good that we’re in solidarity with developers who have to make a living offering great products 😊.
Thrive Leads is one of the most popular plugins to increase the number of subscribers on your website. You won’t find it in the WordPress directory as it doesn’t have a free version. You can get it at the Thrive Themes website, choosing between the following licenses:
For a single payment of $67 you get a license for a single website; for $97 you have up to 5 licenses; and for $147 you get 15 licenses. All three plans include unlimited updates and one year of support.
Main benefits of this plugin:
You can create a variety of forms or opt-ins (in content static banners, lighboxes or popups displayed on top of a content, covering it, post footer forms that appear at the bottom of your content, ribbon forms displayed on top of a page, full screen lightboxes or screen fillers, scroll mats, slide-ins forms that smoothly show up in a corner of the screen, side bar widgets, content locks and multisteps forms, etc)
Specific pre-designed form templates are available for different sectors
You can customize the design of the forms
You have several form triggers (when you leave the page, after a period of time, when you have scrolled to a certain point, when you click a button or link)
You can perform A/B tests on the forms and see which ones work best
You can differentiate what information to show your visitors depending on whether it’s a new visitor, a subscriber, or if it’s already a customer
You can segment the display of a form depending on what is being visited, by category or tag, by post, by page, or custom post type, among others. And group them by campaigns (lead groups)
You get detailed reports of the conversion your lead magnets are getting
It easily integrates with a large set of email marketing services and social networks: MailChimp, MailRelay, Mail Poet, SendGrid, Sendinblue, Sendy, GetResponse, Facebook, Twitter, etc
It is a plugin easy to install and start working with without technical knowledge. But it is important that you take into account before you start working with this plugin how Lead Groups work. These are used to create campaigns or group a set of forms that you want to show in certain places on your website (for example on certain pages or all posts etc.).
You should know that if you create several groups and design two forms for the same website, the opt-in of the group at the top of the list will always prevail. Don’t get confused with this or you won’t know why certain lead magnets don’t show up to the user.
OptinMonster is one of the most popular opt-in applications in WordPress. OptinMonster itself is not a WordPress plugin, it is a stand-alone payment application that integrates into WordPress. In the WordPress Directory you will find the free OptinMonster App plugin connector that allows you to create an account and connect to OptinMonster.
You can subscribe to OptinMonsterwith 4 different plans: Basic ($108 per year), Plus ($228 per year), Pro ($348 per year), and Growth ($558 per year).
And as shown in the image, Basic is for a single site, with which you can create 3 simultaneous campaigns with a maximum limit of 5,000 views per month; Plus is for up to 3 sites and you can create unlimited campaigns with a maximum of 15,000 views per month; the Pro plan allows you to have it installed in 5 sites and the maximum of campaign views is 100,000 views per month; and with the Growth plan you can install it in 10 sites and conduct campaigns that have 500,000 views per month.
OptinMonster and Thrive Leads offer many similar functionalities. With the OptinMonster’s Pro plan, you have practically the same types of forms as Thrive Leads, the same triggers, and you can also perform A/B tests.
The most notable differences between the two are:
Thrive Leads is a WordPress plugin and OptinMonster is a stand-alone software. That means that with Thrive Leads everything you create is saved in your WordPress database; in the case of OptinMonster you save it in its database. Also, if your website is not WordPress (that is, it’s a PrestaShop, Shopify, or Magento, for example) OptinMonster is your product. Finally, if you want to manage several accounts at once, with OptinMonster you can do it directly from its application; with Thrive Leads you will have to go to each of the different WordPress sites.
The two products have different types of visual editors to design the popups. Thrive Leads has its own quite complete visual editor with which you can edit all the opt-ins and OptinMonster has the Canvas function with which you can edit some opt-ins.
OptinMonster focuses more on user behavior and includes pop-up trigger options (Adblock detection, geolocation, etc.) that can be especially useful if you have an e-commerce. Thrive Leads focuses more on the results you get from A/B tests and getting more subscribers.
In OptinMonster each campaign is determined by the type of opt-in it uses. That is, Campaign 1 uses a normal pop-up and Campaign 2 uses a pop-up that slides from the right side. In Thrive Leads the campaigns are determined in Lead Groups where you group several forms. For example, Campaign 1 will include the two previous pop-ups and a widget.
A more recent opt-in plugin for WordPress that has been growing in popularity is Bloom. Bloom is a plugin from Elegant Themes, best known for its Divi theme and Divi Builder visual editor.
The price is $89 a year or $249 for life. And this price not only includes the Bloom plugin, but also includes all Elegant Themes themes and plugins. So, if you had already paid for one of them, it is clear that this option is very important to you, since you already have it for free; but if you are only interested in this plugin, it is cheaper than OptinMonster but more expensive than Thrive Leads.
Bloom is a little more limited than the previous two, yet surely you have everything you need:
You have 6 different types of forms: normal pop-ups, pop-ups that fly in, bar below posts, in line optine, locked content or widgets
Among the possible triggers of opt-ins includes that of activating a popup after a time of inactivity or after a purchase, which we do not have them in the other plugins, but instead, does not include that shows up when it detects that the page is abandoned
You can integrate it to different email services, just like the two previous plugins
It allows you to segment by categories and refine where you want a lead magnet to show up or not, including or excluding specific pages and posts
What Bloom does not include, unlike Thrive Leads and OptinMonster, is a visual editor of the changes you make in an opt-in. You just specify your style options and view it later by clicking the Preview button
As you have seen, the three plugins, Thrive Leads, OptinMonster, and Bloom meet the needs you may have to capture leads: multiple types of forms, templates that you can customize, integration with the most popular email services, and A/B tests.
Some of the differences to highlight are, on the one hand, that OptinMonster and Thrive Leads include the “leave page” trigger and Bloom does not. In addition, each has a different set of options and levels of control over how to create campaigns. And finally, with Bloom and Thrive Leads, with a single payment you have all the functionalities and with OptinMonster you have different prices for different features.
In fact, the main difference is the price. You can compare annual subscriptions:
$67 – Thrive Leads (just one license).
$89 – Elegant Themes (87 themes and 6 plugins including Bloom)
$348 – OptinMonster (Pro package with all features included).
Our opinion? We use Thrive Leads because, from our point of view, it’s the one that offers the best quality-price ratio. But if you already pay for Elegant Themes, which already includes Bloom, you probably don’t need anything else. And if you are looking to optimize an e-commerce or if your website is not made in WordPress, or you want to manage several accounts at once, do not hesitate to consider the OptinMonster option, which is very complete.
Are you a WordPress enthusiast? If you are, then you need to take a look at our new plugin–Nelio Content. There’s so many things you can do without leaving your Dashboard ever… Discover them all!
The best way to learn something in this life is to put it into practice. If you are one of those who want to master Google Analytics, no matter how much articles you read or how many courses you do, the best thing for this purpose is to try it yourself on your website.
The main problem is that it will take some time to capture enough data to start drawing interesting conclusions by reviewing the Google Analytics reports. And if on top of that your website has little traffic, it will be even more desperate to start putting into practice what you have learned.
Luckily for you, there is a solution so you don’t have to wait to have a Google Analytics account full of data to work on it and become an expert of this web analytics tool. But before we get started, let me tell you a little about the Google merchandise store 😇.
The Google Official Merchandise Store
It’s possible that you didn’t know about it, but Google has an official merchandise store where they sell a whole series of different products with their brand and those of their other star websites, such as YouTube. To be able to enter this store, you only have to go here.
The first thing you may think when you see this store is if there will be many people who buy this type of products. Is there really a market to sell T-shirts, pullovers, glasses, stickers and other products with the brands of Google, YouTube, Android and so on? How much does Google earn each month selling swag?
What if I tell you that you can see this data without expending a single penny? Would you like to access the Google Analytics account of the Google Merchandise Store? Then continue reading…
Learn by Exploring Real Data From The Google Merchandise Store
Google Analytics provides a demo account so you can test all the features that this web analytics tool offers. And the data for this account comes directly from Google’s merchandise store. A curious exercise of transparency that we all applaud here.
To access this demo account simply visit this link. There you will find all the explanation of the demo account and you will be able to include it in your Google account, as if it were just another website you control in Google Analytics. Remember that you will need to have a Google Analytics account, something obvious to be able to see all this.
The Google Analytics demo account data corresponds to what you might find on a conventional e-commerce website and includes the following information:
Traffic source data: Information about where website users originate. This includes information about organic traffic, paid search traffic, and display traffic.
Content data: Information about the behavior of users on the site. This includes the URLs of pages that users look at, and how they interact with page content.
Transaction data: Information about the transactions that occur on the Google Merchandise Store website (purchases).
All users of the Google Analytics demo account have read and analysis access; that is, they can view configuration and report data, work with report data (e.g., filter a table, add a secondary dimension, or create a segment), but they can’t modify account settings or defined goals. This is normal, since as we said before, the access is read-only.
In the following screenshot of the Google Analytics demo account you can even see the sales funnel of the Google merchandise store. Note that all these data you see here is real data taken from the online store itself. And who knows? If you propose some improvement to their website to make them sell more, they might even hire you at Google 😉.
If you want to know which product has sold most in the last 30 days or in any period of time, you only have to check it in the corresponding section of the Google Analytics demo account. It’s curious that when I’m writing this the thing that most benefits produced to Google was a security camera 🧐.
Don’t waste another minute and see what you can discover with the Google Analytics demo account. To have a real example of analytics from an online store surely serves you well to learn a lot about it.
Now you have discovered the possibilities that Google Analytics provides you with the Google Merchandise Store demo account. In this account of Google Analytics you have the real data of a web with an interesting number of visits and you can investigate the complete analytics of a real e-commerce system.
This resource is very interesting if you are starting to familiarize yourself with Google Analytics but you are still a little bit scared or you don’t have a decent website in which to install a tracking code and start collecting data. You will be able to touch and watch as much as you want without fear of breaking anything, since you are in front of a safe demonstration environment. The dream of every student!
I encourage you to take a look at it and start messing around with this demo account. You’ll learn a lot about Google Analytics and you’ll be able to apply your learning to your own website in the near future.
This site uses proprietary operational cookies that have a purely functional purpose and third-party cookies that help us understand how visitors interact with the site by collecting and presenting information anonymously. If you continue browsing, you accept their use but you can disable them if you wish. Read more…