Mobile Theme: Automatic Optimization for Mobile with Newspaper Theme

Home

The Mobile Theme is a feature specially designed to maximize the theme performance on mobile devices.

Mobile devices are evolving at the speed of light, becoming smaller and faster each day. The key to the digital user experience is in your hands as visitors are searching for information and expect fast page loading speed & fresh content. This is the ultimate challenge: making mobile experiences as fast and rewarding as the desktop ones. We took all these aspects back to the design board and solved them by creating the new Mobile Theme feature.

The philosophy

The mobile browsing experience is often frustrating. The causes are multiple: slow page loading speed, a small text which is hard to read, low-quality images, banners blocking the content, buttons that are too close to each other making it impossible to tap on the desired one, and so on. We decided to put an end to this mess and, for this, we built the “Mobile theme.”

How does it work?

The Mobile Theme is a lighter, performance optimized template included in the Newspaper package and it loads ONLY on mobile devices. The Mobile theme comes with a template for pages, posts, categories, and more.

We have carefully tuned each template to offer optimal performance and excellent user experience. The posts come in a predefined, clean format including all the features available on the main theme. On the homepage, for example, it automatically renders a grid that contains featured posts and a latest posts section.

The theme doesn’t require any other plugin and ensures maximum performance. Once activated, a new administration panel becomes available in the Theme Panel area to allow you to customize various parameters for the “Mobile theme.”

Mobile Theme with Amp Support

Caching: The Mobile Theme works fine with WP Super Cache plugin. For more details on how to set the plugin visit the Cache plugin – install and configure page.

Installation:

You can install and activate the plugin in the Theme Panel under the Plugins section

tagdiv mobile theme

 

Page customization:

For Homepage, the “Mobile Theme” comes with a single predefined page template that includes two sections:

  • top grid – displays 3 featured posts (posts included in the Featured Category)
  • latest articles – shows the latest articles

This template appears only if a Static Page is used. You can check out the page settings in the WordPress Admin panel Settings->Reading section.

How to add images, custom HTML or text?

You can bring these elements inside the Mobile Editor by editing the page.

tagdiv mobile theme

 

On the front-end, the custom elements appear between the Top Grid and the Latest Articles section.
mobile theme

Important note:

Regular pages – The content of custom pages (ex. Contact Us page), present on the desktop version of Newspaper theme, does not appear on the “Mobile theme.” The mobile version comes with an editor and gives you the possibility to add content that’s specially designed for mobiles. This offers you the opportunity to display the same content in two different ways, one optimized for desktops and another for mobiles.

Page builder elements – For optimal performance, we removed the page builder dependency. You cannot use the page builder elements for the “Mobile theme” pages. If you want to display the same elements on both mobile and desktop, don’t use the mobile theme. Your website built on Newspaper theme will still look awesome on mobiles due to its responsive design. The Mobile Theme enhances the small screen user experience, but it is optional.

The Mobile Theme Settings:

Once the plugin is installed a new tab called “Mobile Theme” shows up in the Newspaper -> Theme Panel area. The options allow you to customize the look and functionality of the mobile theme.

tagdiv mobile theme

Mobile settings:

  • AMP settings – activate the AMP support.
  • The main menu – select the main menu
  • Footer menu – select the sub-footer menu
  • Show sign in / join – choose if you want to display or hide the user register/login area, it will appear in the main menu panel

tagdiv mobile theme

Theme colors:

  • Accent color – theme main color which applies to various elements
  • Color settings for the main menu, footer, and sub-footer areas

tagdiv mobile theme

Mobile ads:

  • Ad title – set a title, this appears on top of each ad (optional – by default no title is displayed)
  • General ads – general predefined ad spots, just add the code to the section
  • Article ads – predefined article/single ad spots, add the code to the desired area

tagdiv mobile theme

Excerpts:

  • Title length – set the title excerpt length for modules used by the theme (1 and 2)

tagdiv mobile theme

Custom code:

  • CSS – use this panel to add custom CSS modifications
  • HTML – add custom HTML elements, they will appear at the page bottom
  • JavaScript – add custom JavaScript

tagdiv mobile theme

AMP implementation

Now AMP is integrated into the mobile theme plugin for faster results and can benefit from all of the mobile theme functionality on your AMP pages. All of the mobile theme settings are now AMP compatible. The settings available in the mobile theme will transform your AMP pages into beautiful layouts. Please read our AMP Tutorial to see how to activate AMP on the mobile theme

Wrapping up

The Mobile Theme is an optional functionality you can activate to enhance the small screen user experience on your website. This feature gives you the possibility to customize the mobile appearance while optimizing the performance. What makes the Mobile Theme so hot is that it’s automatically optimizing your website. Easy to install and use with stunning results. If you haven’t tried it yet, now it’s a perfect time!

Subscribe For More!

If you want to be the first to find out more about our themes
please subscribe to our newsletter

Bogdan B.
Bogdan B.
Passionate for gaming, mountain biking and travelling. I face every task as a new challenge to bring my skills to the next level.

81 COMMENTS

    • Hi Joel,

      Thank you for your message. Bellow the custom code explanations there’s an image that shows you where to insert your own CSS, HTML, and JavaScript modifications. Please take a closer look here – https://www.screencast.com/t/fdTWg70j. If you need technical assistance using our Newspaper theme, please open a new topic on forum.tagdiv.com or send an email at contact@tagdiv.com. Unfortunately, the Blog isn’t assigned to the Customer Support section. Thank you for understanding!

  1. Como agregar Código personalizado:
    CSS : use este panel para agregar modificaciones de CSS personalizadas
    HTML : agregue elementos HTML personalizados, aparecerán en la parte inferior de la página
    JavaScript – agregar JavaScript personalizado

  2. Love the Newspaper Theme and it’s mobile version! 🙂

    But there are two things I want to mention:
    First is the mobile theme on my site still a bit slow. Maybe I doing something wrong (I know you improved that with the last update), but I tried a lot…
    Second, there are a few elements of TD composer that are not correctly shown on mobile theme, when in the sidebar. For example the image box element. There is just a small part of the image visible…

    But I’m complaining on a high level – Newspaper is a great theme to work with!

    • Hi Niels,

      Thank you for your kind appreciation! Can you please be more specific about this? Please provide all the details by opening a new topic on forum.tagdiv.com, or via email at contact@tagdiv.com. Our Support Team is ready to assist you! Unfortunately, the Blog is not assigned to the Customer Support Center. Thank you for understanding!

  3. I updated the theme today, and I have a problem with the mobile theme, I do not load the AMP mode anymore, I already used the 3 options that appeared in this update: MOBILE, MOBILE + AMP and AMP, and I have Official AMP for WP enabled in my panel of plugins. Before my score was 85-90 on PageSpeed Google, now it’s only 30 in mobile mode, I want support urgently, because I paid!
    Sorry for bad English I’m Brazilian

    • Hi,

      I have inspected the website, everything seems in order. AMP is active and working, for example https://blog.suabottot.com/sua-with-mom-han-quoc-khuyen-mai-qua-tang-2019/?amp also it is valid when testing. From what I can see you are using the mobile theme only on AMP at the moment. There are currently 3 options to choose when the mobile theme is used, as mentioned in the guide. Please let us know if you have more questions, either create a new topic in the forum, or send us an email at contact@tagdiv.com.

      Thank you!

      • Hola, antes de nada gracias por vuestra ayuda. He instalado AMP y me gustaría saber cómo hago para que en el inicio en vez de “latest articles” aparezca “últimos artículos” Y en el icono de menú aparezca la palabra “menú”
        Muchas gracias.

  4. Please I can’t download the mobile theme plugin, no access, all am seeing is optional and in some other plugins in Newspapers Dashboard, please I need an urgent help ??

    • Hi,

      This section can be hidden with some custom CSS code. I need to know your website URL and some useful screenshots with that section so I can identify it closer. If you need more assistance in this case, please open a new topic at our support forum from here -> https://forum.tagdiv.com/forum/newspaper/

      Thank you!

  5. Hi guys,

    I’ve been using your theme for years and recently decided to try the mobile and AMP implementations.

    I understand it doesn’t render page building elements, but it also doesn’t seem to support embeded features, like facebook videos. Is there a way to include this? A lot of my posts contain embeded video’s from facebook and I would love to be able to capture these in a mobile version of the site.

    The same applies for modal / popup images. When a user clicks an image when on the mobile theme, it jumps directly to the image file, as opposed to staying within the page and displaying it in a popup.

    Any advice?

    Thanks!

  6. Hi,
    My Newspaper version theme is 9.7.2. and his plugin is updated. By i have this message in theme panel : “This version of the tagDiv Mobile Theme plugin is not supported by the current activated theme!
    Please make sure you’ve updated the theme properly! Follow this guide”. Why ?
    Thanks for your answer

    • Hi,

      This error message appears because your theme was not correctly installed and also, neither of the required plugins were not correctly updated, including the mobile theme plugin. You have to delete the old theme and update the new one from the theme packet. If you need more assistance in this case, please open a new topic at our support forum from here -> https://forum.tagdiv.com/forum/newspaper/

      Thank you!

  7. hello i use newspaper theme but when i install the mobile theme it did not work correctly. i means at the first mobile theme show me a page and you should the join or register to go website no other ways to go website.
    i have a this problem its so nice to help me.

    • Hi,

      I have checked your website and I saw that you are not using our theme. Please note that our mobile theme should work as expected on pages. If you need more assistance in this case, please open a new topic at our support forum from here -> https://forum.tagdiv.com/forum/newspaper/ and we are gladly helping you!

      Thank you!

  8. I have licence but not using your theme (i am agency and planing to use on my customer website)

    – AMP pages are seperated URL or same url ?
    – are regular pages displaying on AMP results ? because some of important contents are page for us not posts.
    – is AMP fetature working correctly on woocommerce ?
    – we have 2 type of content – 1 old wordpress default tinymce editor.
    – some of our contents on wp baker builder ….

    So what is the best practice for future creating content (for mobile and AMP supported)

    i thing directly using tagdiv builder is the best way isnt it ?

  9. I am activated mobile theme and AMP but pages like ” contact page, disclaimer, about us” are no longer showing on the mobile theme.

    They show are the footer but when you click on them to open you will find the contects empty.
    What do i do? Check https://www.agvictor.com

    • Hi Victor,

      Please note that the mobile theme does not recognize any shortcodes in the front end. So, if al;l of these pages was created with the page builder, please note the mobile theme will not render them on the front end, sorry! You will need to add some text inside the Mobile Editor when you edit your page from here -> https://www.screencast.com/t/t1lE2ABxqxd Furthermore, if you need more assistance or technical support, please open a new topic at our support forum here -> https://forum.tagdiv.com/forum/newspaper/, because our the blog is not assigned to the support team.

      Thank you!

  10. Hello,
    I’m French, I hope you will understand me…
    When I’m on “plugin”, I do not have an “activate” button for the plugin “tagDiv Mobile Theme”….
    Why ?
    Thanks for your help !

  11. Hi,

    It is possible to have a link or menu in mobile theme which the user will select the desktop edition of the site? I want to give the mobile user the selection to switch to desktop edition of the site.

    Thank you.

    • Hi,

      Unfortunately, the theme does not have any such an option that allows you to activate this functionality, sorry! You will need to find such a plugin with this functionality and check how it goes. Thank you for your interest in our theme. Unfortunately, the blog is not assigned to the support team. For support, please open a new topic on forum.tagdiv.com / http://forum.tagdiv.com/forum/newspaper/ and provide all the details. Our expert team is ready to assist you ASAP.

      Thank you!

      Thank you!

    • Hi,

      That is possible, after the latest updates there is now an option to disable the mobile theme per page or post. So if you would like to disable it for the homepage, all you have to do is to open the page in Gutenberg and there will be an option in the top right corner https://prnt.sc/ooevck This option is available for pages and posts, and will be visible only in Gutenberg.

      Thank you!

        • Hi,

          Please note that the Gutenberg is a default functionality of WordPress which come bundled with the WordPress install and it cannot be enabled or disabled.

          Thank you for your understanding!

          • I see, thank you.

            One more point/question: I like the mobile theme, but it needs to be able to do more in terms of rendering content well on a small device/phone for ALL pages, and not requiring me to have to create a separate set of mobile pages, or at least, allow Page Builder to help me to create them without have to dealing with a lot of HTML, etc.. What are you guys doing to improve this situation?

            Overall the Mobile theme is a good first step, but it needs to do more for me to really love it.

          • Hi,

            The Mobile theme has been designed to be very fast and therefore page builder is not allowed, sorry! Please note that if you do not want to have mobile theme functionality for a specific page, you can turn off it from the Page Editor. For more details, please check the documentation from here -> https://forum.tagdiv.com/the-mobile-theme/ If you need more assistance in this case, please open a new topic at our support forum from here -> https://forum.tagdiv.com/forum/newspaper/

            Thank you!

  12. Hi,

    Received this feedback from Google today. Is this common?
    ———————————————————————————————————-
    Search Console
    AMP issues detected on https://longtailoffinance.com/

    To the owner of https://longtailoffinance.com/:

    Search Console has identified that your site is affected by 1 AMP issues:

    Top Warnings

    Warnings are suggestions for improvement. Some warnings can affect your appearance on Search; some might be reclassified as errors in the future. The following warnings were found on your site:

    Image size smaller than recommended size

    We recommend that you fix these issues when possible to enable the best experience and coverage in Google Search.
    ——————————————————————————————————————————————————————————
    Had thought AMP/Mobile them took care of the image size. Please advise. Thanks.

  13. Hmmm. Well, 1200 pixels wide is a huge size for a featured article image. This can’t be right, as if I were to change to that size the images would become distorted. What am I missing? Thanks.

    • Hi,

      Depends on the images you use, try to set images that have a native size of 1200px or more, the results will be good. If this is the requirement it should be respected in order to avoid such issues.

      Thank you!

  14. Hello

    I have recently installed the mobile theme pluging and the amp (both from Newspaper plugins section)
    I am struggling with two issues currently:
    1) Mobile Ads
    If I place the Javascript code of adsense in any field, say header, footer, article inline etc, I always get to see the ad ONLY ON HEADER area.
    2) AMP Ads
    Google Adsense provides a Javascript code to place in the header of AMP’s header. How can I add that.
    Secondly, Adsense also provides a code to place in the body of AMP’s HTML, should this be pasted in the field ‘ADSENSE AUTO ADS FOR AMP’, considering I prefer the auto ads feature.

    • Hi,

      1. Depends on the ad type you are using. Please check the instructions and documentation for implementing the respective ads.
      2. No need to enter the auto ads script in the header, the theme will load it automatically. Just enter the auto ads code in the theme panel https://prnt.sc/osemq8 then the ads should begin to appear after a while.

      Thank you!

  15. very easy for optimization. Thank you very much. but recenlty i face some problem like

    Notice: Undefined property: stdClass::$plugin in /home/sites/3b/8/8f907fb5ac/public_html/wp-includes/class-wp-list-util.php on line 152

    Notice: Undefined property: stdClass::$plugin in /home/sites/3b/8/8f907fb5ac/public_html/wp-includes/class-wp-list-util.php on line 152

    i dont know how can i solv can you help me rolving this problem

    • Hi,

      Do you use the latest version of the theme and WordPress? Does this issue happen with a default WordPress theme, or if you deactivate all non-theme plugins? If you already checked and isolated the problem to the theme or a theme plugin, we could take a look. Please send us an email at contact@tagdiv.com and provide admin login, also cPanel will be helpful. Mention how we can see/recreate the problem. Also please provide a license key with valid support in the email. Let us know.

      Thank you!

  16. While old versions work fine with AMP and mobiletheme, latest version has a problem, if official AMP plugin and tagdiv mobile theme are enabled there is no way to go to settings of AMP. tagdiv AMP plugin at old versions was perfect

    • Hi,

      Our previous dedicated AMP plugin is not provided anymore. There are AMP settings in the dashboard https://prnt.sc/ouy0tq if you actually use AMP, meaning one of the two settings in the screenshot. If there is a problem using the mobile theme and AMP we can take a look at it. Please send us an email at contact@tagdiv.com and provide the website and admin login, also provide a license key with valid support. Let us know.

      Thank you!

  17. The case is that after enabling the mobile theme, icon of amp at left hand wp admin menu disappears while was visible before.
    Tried firstly to install enable AMP official plugin , it is visible, options though are fewer than what i see at your manual.
    If install and enable mobile theme icon disappears.
    If i install first mobile theme and then amp plugin , amp icon at left hand menu does not appear.
    Tried different servers, centos 7, php 7.1,7.2 every time same result, seems that in a way amp plugin is someway deactivated by mobile theme.

    thanks!

    • Hi,

      Should appear if one of those two options is selected https://prnt.sc/ovf5gq In our tests it works correctly. After you select on of the two AMP options in the mobile theme settings, refresh the theme panel page and the AMP settings should appear in the dashboard. If there is a problem, contact us as mentioned above and we will take a look. Let us know.

      Thank you!

  18. Some more research:

    Everything works fine with mobile theme and AMP plugin as per manual and your instructions with version 9.6.1(just saw at the manual you were using 9.6.1 …)
    Problems i described are with 9.7.4 and 9.8
    Hope it helps
    thanks!

    • Hi,

      It should work with those versions as well, I am testing on 9.8 please see here https://prnt.sc/ovf868 Also we haven’t had similar reports from users as far as I know. Maybe it is a conflict with one of your other plugins, you could try to deactivate all non-theme plugins, just leave the theme plugins and AMP plugin active. Check if this solves the problem.

      Thank you!

  19. Ok tried this
    Disabled all plugins except AMP, so AMP icon is visible at left hand menu.
    Started to enable one at a time, AMP icon remains visible till i enable TD Composer.
    Thanks for help anyway, 9.6.1 is not bad at all

    • Hi,

      Thank you for your kind thoughts and words! We are delighted to discover that our work it’s appreciated the way you do. We truly value your feedback!

      Have a nice day!

  20. Coming back for the amp/mobile case with some new facts.

    9.6.1 works fine in any condition

    9.7.4 and 9.8 work fine in a clean for amp/mobile theme on a fresh install with any plugins activated but AMP settings disappear and AMP pages do not work after installing whatever demo

  21. Hello!

    I already use the mobile theme, but sometimes the mobile version dont work. Sometimes i see the mobile theme and other times i see the normal theme (in safari, iPhone 7).

    This is normal?

  22. I got this Email from Google search Console, How to resolve it ??
    To the owner of https://crawlbytes.com/:

    Search Console has identified that your site is affected by 3 Mobile Usability issues:

    Top Issues

    The following issues were found on your site:

    Viewport not set

    Clickable elements too close together

    Text too small to read

    We recommend that you fix these issues when possible to enable the best experience and coverage in Google Search.

    • Hi,

      Please update the theme to the latest version of it! That version offers you more options for Mobile Theme which allows you to change the filter for the top big grid on mobile. If you need more technical assistance, please open a new topic at our support forum from here -> https://forum.tagdiv.com/forum/newspaper/ and our team are ready to assist you.

      That you!
      Best regards!

LEAVE A REPLY

Please enter your comment!
Please enter your name here

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Check out our latest

Stories