Styling and hiding elements

  • Resolved vladnice

    (@vladnice)


    5 years, 10 months ago

    Hello, I am testing your plugin and I’m liking it quite a lot so far!

    But there are 2 issues I can’t find a solution for.
    I am using my own theme (mostly because there’s a bunch of visual composer code)

    1. I would like to hide some elements in the app but keep them in the mobile web version. How can I achieve this ?
    This is very important to me as I need the app to look a little different from the mobile version.

    2. I would like to add some styling to the splashscreen image. I would like to add {background-size: contain;} to it but can’t manage to do it.
    I have tried to add this code to the css section of your plugin but it doesn’t work :
    .wpappiframesplash {
    background-size: contain !important;
    }

    As soon as I have fixed those things, I should be able to buy the license and publish the app ??

    Thanks !

Viewing 11 replies - 1 through 11 (of 11 total)
  • Plugin Author Amauri

    (@amauric)

    Hi ??

    1- You can use the CSS class “body.wpmobileapp” to target element in the app.

    To hide something on the app:
    body.wpmobileapp #theelement {display:none}

    2- The splashscreen is managed by the app, you cant apply custom CSS.
    The app display the splashscreen like the background-size: cover

    The best size for the splashscreen is 600×900.
    The safe area to put text must not exceed 1/2 of the width and 2/3 of the height.

    Cheers!

    Thread Starter vladnice

    (@vladnice)

    Thank you @amauric !

    An additional question : if I wanted to use the app theme, is there a way to make visual composer blocks work in there ?

    Thread Starter vladnice

    (@vladnice)

    Sorry I forgot another question :

    You answered on how to hide an element on the app. Can you please tell me how to show an element only on the app, please?

    Thank you.

    Plugin Author Amauri

    (@amauric)

    1- Visual composer blocks work if they are in a plugin, blocks of your website theme cant work with an another theme.

    2- Just invert the rule:

    .onlyInApp { display: none }
    body.wpmobileapp .onlyInApp { display: block }

    Thread Starter vladnice

    (@vladnice)

    Thank you @amauric that’s helpful. I’m gonna try that ASAP.

    Do you confirm that Apple requires that the app should be different than the mobile version ? And if yes, to what extent? If I hide some elements and add some others, would that be enough?

    Thanks again for your help.

    Plugin Author Amauri

    (@amauric)

    Apple want a different experience than the website in a mobile browser.

    The best way is to use the wpmobile theme but if you remove some element on your website theme, it can be ok ??

    Here a guide: https://wpmobile.app/doc/4.2

    Thread Starter vladnice

    (@vladnice)

    Hello @amauric you said this earlier in this thread :

    1- Visual composer blocks work if they are in a plugin, blocks of your website theme cant work with an another theme.

    I actually use visual composer (wpbakery) as a plugin but it does not work with the app theme. Is there something I’m doing wrong? For instance, content of wpbakery appears as lines of code only.

    Thank you.

    • This reply was modified 5 years, 9 months ago by vladnice.
    Plugin Author Amauri

    (@amauric)

    A theme can add element to wpbakery and these elements cant be used without the theme that add them.

    What is the line of code ?

    Thread Starter vladnice

    (@vladnice)

    No, it’s ok, my bad, those code lines were added by the theme, not wpbakery. I’m good here.

    Plugin Author Amauri

    (@amauric)

    Great, thanks for the feedback ??

    Thread Starter vladnice

    (@vladnice)

    edited (error)

    • This reply was modified 5 years, 9 months ago by vladnice.
    • This reply was modified 5 years, 9 months ago by vladnice.
Viewing 11 replies - 1 through 11 (of 11 total)
  • The topic ‘Styling and hiding elements’ is closed to new replies.