• Resolved Green

    (@yanggh)


    Hello,

    I want to add dark mode to my site, but it looks all dark mode plugins are not compatible with AMP.

    So, I start to find relative codes to try to achieve it.
    Here is a set of JS which is added to head.php for a dark mode purpose, ref: https://isotropic.co/how-to-add-darkmode-to-any-website-copypaste-darkmodejs/

    <script src="https://cdn.jsdelivr.net/npm/darkmode-js@1.5.7/lib/darkmode-js.min.js"></script>
    <script>
      function addDarkmodeWidget() {
        new Darkmode().showWidget();
      }
      window.addEventListener('load', addDarkmodeWidget);
    </script>

    I’ve tried to fix the AMP validation errors by modifying the JS code according to AMP coding guide. e.g. <amp-script>, src & target, amp-blind JS.

    But it still don’t work. Could you tell me how to modify the code to make the dark mode JS work and be validated by AMP? Or there isn’t any dark mode could be compatible with AMP for now?

    PS. For my site running as normal with AMP, above code snippets are deactivated.

    Thanks,
    Green

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Support Milind More

    (@milindmore22)

    Hello @yanggh

    AMP does not allow custom JavaScript, at least in the traditional way. To make pages valid AMP, the AMP plugin removes the disallowed JS.

    I will recommend developing an alternative way using prefers-color-scheme example of same can be found on amp.dev site.

    I will also recommend checking a simple javascript based solution and check if you can use it with amp-script

    Hope this helps you

    Plugin Support Milind More

    (@milindmore22)

    @yanggh As we haven’t received a response, I’ll mark this as resolved. Feel free to open a new support topic if you continue to encounter issues, or reopen this topic and we’d be happy to assist. Thank you!

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘How to modify the code to make the dark mode JS work and be validated by AMP?’ is closed to new replies.