Support » Plugin: Web Stories » Theme color and centering of the story

  • Resolved Halil ESEN

    (@halilesen)


    By theme color I mean the color of the top notification bar, especially on mobile devices; It can be changed with the theme-color tag or similar.

    However, when I open Web Stories, the theme color stands out, especially if it is white. Because in general the rest of the story is dark.

    Another issue is that the story is adjacent at the top and there is unnecessary space at the bottom, especially in the PWA application.

    Here are all the screenshots:
    Android: https://i.hizliresim.com/4rbb1vq.jpeg
    iOS: https://i.hizliresim.com/54osk3j.png

    Could you make it possible to change the theme color for the stories, at least make it the same color as the background and center the stories?

    Thanks.

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Support Bethany Chobanian Lang

    (@shetheliving)

    Hi @halilesen, thanks for getting in touch! I see that you have an issue open in our GitHub repository that mentions theme colors, as well, and you have also opened a new issue in the AMP repository as my colleague Pascal suggested.

    As Pascal noted, issues with PWA are not something that we can address in the Web Stories plugin as it’s likely these these discrepancies are coming from either the broader Web Stories format (which is part of the AMP repository) or Safari itself. At this time, we don’t have plans to update the Web Stories plugin to accommodate for specific use cases for PWA.

    As such, the best next step here is to follow up on your AMP GitHub issue as well as test in Safari to see if this also requires reaching out to Safari support.

    I’m going to mark this topic as resolved as there are no next steps here for the Web Stories plugin, but please do create a new topic if you have any questions about the plugin. Thank you!

    Thread Starter Halil ESEN

    (@halilesen)

    That thread on Github is independent of that. There I was talking about the theme color being disabled when scrolling links in Standalone display mode.

    Here, I’m asking if the theme color can be changed when opened the story. Because when white is a theme color, it can be disturbing against the story background with a dark background. This is the same even without PWA.

    On the other hand, in stand-alone display mode, a higher area is made available as the browser has no control areas. Since the stories are 9:16 in size, space accumulates at the bottom. The story is not center.

    Plugin Support Bethany Chobanian Lang

    (@shetheliving)

    Here, I’m asking if the theme color can be changed when opened the story. Because when white is a theme color, it can be disturbing against the story background with a dark background. This is the same even without PWA.

    Thanks for clarifying. At this time, there is no “theme” that can be applied to the top toolbar on a mobile device based upon the story’s colors. If you’d like, you can add an issue for this in our GitHub repo.

    On the other hand, in stand-alone display mode, a higher area is made available as the browser has no control areas. Since the stories are 9:16 in size, space accumulates at the bottom. The story is not center.

    The spacing surrounding a story will be dependent on the user’s mobile device and browser. On my iPhone 13 using the Chrome browser, it is in fact centered top and bottom.

    This story display is controlled by the overall Web Stories format, not the Web Stories plugin specifically, so you can try filing a new issue in the AMP repository for more details. That said, given the wide variety of mobile devices and browsers, it’s likely not possible to ensure perfect padding and centering on every device.

    Thread Starter Halil ESEN

    (@halilesen)

    thank you for the information

    On my iPhone 13 using the Chrome browser, it is in fact centered top and bottom.

    Same device but Safari.

    Plugin Support Bethany Chobanian Lang

    (@shetheliving)

    Thanks! That formatting is not part of the Web Stories WordPress plugin, but the general Web Stories format itself. So I’d recommend filing a new issue in the AMP repository to see if they are able to address.

Viewing 5 replies - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.