In this section we want to explain Better AMP plugin options. After installing and activating the plugin, Better AMP tab will be added to the WordPress admin area.

Better AMP options

Now we go through every item to see what are they functionalities.

Translation

Better AMP translation

If you have read Pre-translations you know what is translation about in Publisher. Same as normal pages, AMP view has its own translation panel. Here you can translate semantic words in AMP pages (like: next, share, read more and etc.) to your native language.

In this page you see symbols like %s, in these situations, there is an explanation for the symbol beneath it. Also if you want to change date format, read How to Translate Dates.

Import/Export

Import/export Better AMP options

Here you can simply create a backup of Better AMP options or restoring previous options by backups you have created before. Be cautious about Import, because it overrides all current settings.

Customize AMP

This is the main option panel for Better AMP plugin, here you can customize AMP theme of your website. Let’s take a look at it.

Customize AMP in Better AMP

1- Header

 

header options in AMP

A- Text Logo: This text will be site logo when no image selected for logo (option B – see below). Also this text is used in logo image alt attribute (plus site Tagline).

B- Logo: Select an image for website logo. It’s position is shown in above image. If no image is selected, Text Logo (option A) takes its place.

C- Show Search: Show/hide search button in header menu.

D- Sticky Header: Select to make header sticky in AMP pages.

2- Sidebar

Better AMP sidebar

Above image shows AMP Sidebar button.

Better AMP sidebar options

A- Show Sidebar: Show/hide AMP sidebar menu.

B- Text Logo: This text goes under image logo.

C- Logo: Select an image logo for AMP sidebar.

D- Social share icons: Enter your social accounts URL and also your Email address.

E- Copyright Text: Write some text which indicates your copyright rules.

Tagline: This is the tagline you selected for your website in WordPress settings. For changing it go to Settings → General → Tagline.

AMP Sidebar Menu: Read about it in AMP Menu.

Better AMP Footer options

A- Copyright Text: Write a copyright emphasizing text, also you can use a link in it.

B- Show none AMP version link: When a user enters into an AMP page, he/she keeps surfing in AMP mode until he/she clicks on this button, then redirects to normal version of website.

NOTE: The menu you see above the “View Desktop Version” button, is Footer Navigation Menu.

4- Archive

Better AMP archive options

A- Archive Listing: This is style of archive pages. There are two listing for archive pages:

  • Small Image Listing
  • Large Image Listing

5- Posts

Better AMP post options

A- Show Thumbnail: Show/hide post thumbnail.

B- Show Comment: Show/hide comments.

C- Show Related Posts: Show/hide related posts n AMP pages.

D- Related Posts Count: Number of related posts.

E- Related Posts Algorithm: Choose an algorithm for selecting related posts.

Option F through I exist when “Better Social Counter” plugin is active.

F- Show Share Box in Posts? Show/hide share box in posts (it displays at the bottom of post content).

G- Show Share Count? Show/hide number of shares in social networks. It has three options:

  • Show, Total share count
  • Show, Total share count + Each site count
  • No, don’t show.

H- Social networks: Select which social network icons you want to display.

I- Show Share Box in Pages? Show/hide share box in pages.

J- Featured Video/Audio Meta Key: When you are using video format for your post, you enter a video link in Featured Video/Audio Code field (in post editing). This video displays instead of featured image. ID of this field in Publisher is _featured_embed_code, if you use Better AMP plugin with another WordPress theme, just enter the ID of embed video/audio custom field in here (inspect new theme and find this ID or contact theme author).

K- Share Box Link Format: Use standard link or WordPress shortlink for sharing. Shortlink is recommended for websites with long links or links containing non-English characters.

6- Homepage

Better AMP homepage options

A- Show slider? Show/hide slider of latest posts in homepage. This slider will show up when “Your latest posts” in option B (see below) is selected.

B- Front page displays: Select whether you want to display your latest posts in homepage or one specific page as your AMP theme homepage. It has two options:

  • Your latest posts
  • A static page

By selecting second one, option C activates (see below).

C- Front Page: If you select “A static page” in option B (see above), this dropdown menu activates and lists all pages you have created, select whatever page you want to show it as your AMP theme homepage.

Do not select your desktop homepage which is created by Visual Composer for AMP homepage. AMP pages should be very simple without any external resources (except fonts). This option is useful when you want to code a homepage with HTML.

D- Homepage listing: Select style of homepage posts. There are three options available:

  • Default Listing
  • Small Image Listing
  • Large Image Listing

7- Color

Color change in Better AMP

Here you can customize your website AMP theme colors. Colors you can change are:

  • Theme Color
  • Background Color
  • Content Background Color
  • Footer Background
  • Footer Navigation Color
  • Text Color

8- Google Analytics

Insert Google Analytics Code in Better AMP

Insert google analytics account id. Its format is like this: UA-XXXXXXXX-X. Google Analytics Code of normal version doesn’t work here and you should enter its account id or even create a new Google analytics code and observe distinct analyze for AMP pages.

9- Additional CSS

Add custom CSS codes to Better AMP

This is just an empty field (if you didn’t add anything before) ready for adding custom CSS codes which act only in AMP theme. Enter your CSS codes and click Save & Publish button.

10- Custom HTML Code

Custom HTML codes in AMP pages

Be careful! Adding invalid custom codes, invalidates your AMP pages. Read AMP documentation before doing any uncertain changes.

Please note you cannot add any stylesheet file to AMP pages except fonts, source. And only can add script files which are provided by “ampproject” servers, source.

A- Codes Between <head> and </head> tags: Add codes between head tags.

B- Codes Right After <body> tag: This code will be added exactly after body tag opening.

C- Codes Right Before </body> tag: This code will be added exactly before body tag closing.

11- Advanced Settings

advanced settings in AMP pages

A- Exclude URL From Auto Converting: You can exclude URL(s) of your website to prevent them from converting into AMP URL. You can use * in the end of URL to exclude all URLs that start with it. Eg. yoursite.com/test/* will exclude all the pages that their address start with yoursite.com/test/

You can add multiple URLs in multiple lines.

When a visitor clicks on an excluded link, he/she redirects from AMP version to desktop version of website.

B- Show AMP for Mobile Visitors: Redirect all mobile visitor AMP version of site automatically. Works with all cache plugins.