Global demo menu
This site navigation

Category: weeblrAMP

Multipage articles

Best user experiences are consistent: when an article has several pages, weeblrAMP will respect that and display a pagination bar. This provides users with a continued and smooth reading experience.

Multiple pages articles are created by inserting the <!–nextpage–> code in your articles wherever your want to create a new page.

Easy galleries

Image galleries created with WordPress are automatically transformed into AMP carousels.

This gallery was created using the Create Gallery feature of WordPress media manager.

On the AMP version, a nice row of thumbnails is also included (you can disable that) for quick access to individual images.

Shortcode attributes gives you complete control over the visual aspect of the final carousel, which is fully responsive.

 

 

Easy Ads display

Accelerated Mobile Pages allows for fast and unintrusive ads display, but inserting them manually can be cumbersome. weeblrAMP lets you insert ads easily and in a flexible manner

Predefined ads areas

You can use any of the AMP-supported ads providers (list is here), and display ads either before or after the main content (or use shortcode for other locations, see below)

Ads automatically inserted in content

weeblrAMP will insert ads at your command. For instance, every 3 paragraphs or after paragraphs 1, 4 and 7.

You can specify different rules for posts and pages. And as usual multiple filters let you insert ads based on:

  • a post category
  • its tags
  • post IDs

weeblrAMP will try to be smart with paragraphs, so small ones are not counted for instance – but there is a filter for that too!

Shortcodes, wherever you need ads

But only displaying ads before or after content, or in an automatic fashion is rather limitating. And so weeblrAMP lets you use the wbamp-embed shortcode to insert ads.

Here is an example:

The shortcode used to display this ad is:
wbamp-embed type=”ad”
Without any more information, the shortcode will cause the default ad type to be displayed. But you can also specify more attributes, such as ads network to use to mix and match multiple type of ads on the same page. Here is another example with another Ads network supplier, A9:

Here is the shortcode used to display this ad:
wbamp-embed type=”ad” ad-type=”a9″ data-aax_pubname=”test123″ data-aax_size=”300×250″ data-aax_src=”302″ width=”300″ height=”250″

Using these shortcodes, you can display an ad in the exact desired location.

 

 

Menu and search box

AMP pages can have multiple navigation menus, and the common search box as well, adding more interactivity to your AMP site.

Navigation and menus

Create menus using the usual WordPress Appearance menu. Then simply tell weeblrAMP which ones you want to display, and if links in the menu should be AMP or not:

AMP menus can slide-out from either side of the page, or slide down from the top.

Check out the menus on this page by clicking the icon et top of page, and navigate through this demonstration

By default an hamburger menu icon is used to open the menu,  or you can replace the icon with a word, such as Menu. Alternatively, menus can also be displayed permanently

The icon/word can be located in multiple position, selectable from the settings.

Search box

Similar to the menu, weeblrAMP will let visitors discover your content. You can choose from a variety of locations for the search icon, or display the search box permanently (on the page or even inside the navigation menu).

Click on the search icon and test Accelerated Mobile Pages search in action

Easy and advanced analytics

weeblrAMP Google Analytics integration is fairly advanced, but also really easy to use. For basic usage, choose between Google Analytics and Google Tag Manager, and enter your property ID (we will pick up the ID from Yoast SEO if you use that):

As you may have noticed (on the AMP version of this page), we have also enabled a cookie consent as an AMP notification. No Analytics tracking will occur until the visitor has accepted the notification.

Most importantly, user events such as clicking on a button, or scrolling down a page can be tracked very easily, with absolutely no coding required.

On this site for instance, clicking on the buttons below to navigate between pages will record an in Google Analytics.

The required AMP code has been generated for your automatically and inserted in AMP pages.

 

Automatic Disqus Comments

Comments can be displayed on AMP pages just like on your site standard pages. Visitors will be able to leave comments using either WordPress standard commenting system, or with Disqus.

Please test commenting!
You can leave comments both on the AMP and standard versions of this page.

WordPress comments

Out of the box, comments will show on your AMP pages exactly in the same circumstances as they do on your site: hidden for posts where you disabled them, or not at all if you disabled commenting.

Disqus comments

Using Disqus comments on your AMP page is normally rather complex: you need to create a small HTML file with some specific content, and put it on a server:

  • on a different site than yours
  • using HTTPS

and then you must insert in your content some rather obscure HTML code where you want the comments to appear.

With WeeblrPress and weeblrAMP, you do not need any of this, and enabling Disqus comments site is as simple as entering your Disqus shortname and pressing the “Use Disqus comments” button:

Note that comments are still attached to a given post or page: comments on the AMP version are also visible on the standard HTML page, and vice-versa.

Likewise, users can comment on the Google AMP cache version of your page just the same as if on your own site.

 

 

AMP forms

Forms are the basis of any interactive site: landing page, contact us page, etcAMP forms with weeblrAMP are simple: we will convert Contact Form 7 and GravityForms forms automatically, sometimes with a few restrictions.

You will find below 2 sample forms, one for each plugin. Please test them on the AMP version of this page!
(all data is discarded when the site is reset each day)

A ContactForm7 form:

A GravityForms form:

  • This field is for validation purposes and should be left unchanged.
Welcome! we have cookies, want some? ;)