Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • December 15, 2018 at 4:13 pm #1045659
    Dee

    Hi Guys

    I am creating a site for a client and using Enfold. I have installed a plugin and have created flip boxes. These boxes layout in a row next to each other perfectly on my laptop and desktop. However when I go onto a mobile the layout is no longer mobile friendly.

    Please advise.

    Thanks
    Dee

    December 15, 2018 at 4:46 pm #1045668
    cg

    Which plugin do you use? Are you sure, it’s not the fault of the plugin to not create mobile friendly flip boxes?
    When you use an external plugin which inserts its own html-output and css to your site, Enfold can’t really ensure the outcome of that …

    I see two possibilities:
    1. Use a plugin that creates mobile optimized html/css and is compatible with Enfold
    2. Add the Flipping Effect via CSS (and maybe some JS) to responsive elements from Enfold … should be possible with some tweakings …

    For option 2: https://davidwalsh.name/css-flip

    December 15, 2018 at 5:06 pm #1045672
    Dee

    Hi CG

    Thank you for getting back to me.

    I am using FlipBox and was told it is mobile friendly.

    Can you possibly let me know what CSS to use on an element/box to flip the content?

    Thanks
    Dee

    December 15, 2018 at 5:31 pm #1045679
    cg

    For CSS to create a Flip effect on page elements see the link in my first comment.

    I created a quick test with “FlipBox” … also i think it is a bit “overcrowded” with options and i don’t really like it … hehe … :-)
    and it is working with Enfold … and adjusts in mobile view (only tested in browser by resizing)

    => https://enfold.tabulor.de/flipbox-test

    This is what i did:
    – installed and activated “FlipBox” (this one: https://de.wordpress.org/plugins/image-hover-effects-ultimate-visual-composer/)
    – created a FlipBox
    – new Page, switch to Avia Advanced Layout Builder
    – inserted a color section an a headline
    – inserted a ‘Code Block’
    – pasted the FlipBox shortcode into the ‘Code Block’

    December 16, 2018 at 8:36 am #1045832
    Rikard

    Hi,

    Thanks for helping out @cg, did you try that out @dee?

    Best regards,
    Rikard

    December 17, 2018 at 4:12 pm #1046356
    Dee

    Hi

    Thanks for getting back to me.

    I have not yet but will do soon and get back to you.

    Thank you for your help.
    Dee

    December 17, 2018 at 4:39 pm #1046370
    Dee

    Hi Guys

    OK I have done a gallery of flip boxes and on a mobile device the writing still does not fit within the block. Did you do 3 separate flip boxes as that seems to make the flip box larger on a mobile so that the text displays correctly? Your 3 blocks seem to display correctly and underneath each other.

    I have done a test page – link in private content – so that you can see how my text displays on a mobile device.

    Thanks
    Dee

    December 17, 2018 at 5:37 pm #1046393
    cg

    Sorry … i can’t see private content to check your test page as i am only a participant here in the forum like you.

    I created “one” FlipBox-Element with “three” containing boxes.

    But, honestly, i think for such detailed questions to the functionality of “FlipBox” you may be better served, asking the developers of that plugin.

    • This reply was modified 6 years ago by cg.
  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.