Home › Forums › Air WordPress Theme › air theme mobile version width issues

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • July 26, 2018 at 3:42 pm #15909
    theme-user
    Participant
    Purchased
    Expired

    Hi there, I have problems with mobile version of page made with air theme.

    So if I use Page builder to get 50% page width on desktop it is ok. Page template is off (none selected).
    But it looks like on mobile this is also trying to keep 50% width of page and after all text is sometimes like column of four letters.

    I tried to change page template to “Introduction above list” it looks fine – when text is viewed on desktop – there are marigins on left and righ (and text is about 50% of page width). On mobile text is stretched to page width and thats fine.

    But. Page Builder is giving more customization and content cration options.
    So I have few ideas to help me with solving this problem.

    1st – my favourite. Can you provide tutorial (or template) of page, which would be based on page builder and: on desktop it would have 50% width, on mobile fit to screen width).
    Also, if there are modules next to each other on desktop version (e.g. text field 1/2 of page and contact form7 1/2 of page) I would like to be able to decide what will they do on mobile. It would be great to force them to be in one column one above other. Is there easy way to do that?

    2nd solution – using current Introduction above list and using modules inside of introduction text field – is this somehow possible?

    3rd – I want google maps (from your modules) to be on top of the page. When Introduction Above list template is loaded – modules are being loaded below introduction part. Is this possible to switch order, so that first would be google map (full width) and then Introduction part (50% width desktop, fit to width on mobile)

    I hope that my description of problem was detailed enough an you will be able to help me,
    regards 🙂

    Icon WordPress Customization Service from $49 Only! Save your expensive time!

    July 27, 2018 at 2:10 am #15912
    SeaTheme
    Keymaster
    Purchased
    Expired

    Hi,

    1st – Please use this layout like:https://drive.google.com/open?id=17zlg1r4rsl9mjnyuzSsYABKMXqlU945W
    If you want the contact form is 50% width, use 2 1/4 width text blocks(without text) on the right/left.

    2nd – Not possible to put Pagebuiilder into Introduction wrap.

    3rd –
    please go to Appearance > Customize, paste the custom css code to “Additional CSS” box.

    .page-id-481 #content_wrap {
  display: flex; flex-direction: column;
}
.page-id-481.page-template-intro-above-list-body .ux-portfolio-template-intro {   
  order: 1;
}
.page-id-481 .pagebuilder-wrap {   
  order: 2;
}
.page-id-481 .container-masonry {   
  order: 3;
}
@media (min-width: 768px)
.page-id-481.page-template-intro-above-list-body .ux-portfolio-template-intro.container {
    margin-bottom: 0;
}

    The page-id-481 is page id, it without page id, the CSS will affect all pages.
    how to find page id: https://seatheme.net/forums/topic/how-to-find-wordpress-postpage-id/

    Regards!
    Bwsm – uiueux.com – Twitter – Facebook

    Icon WordPress Customization Service from $49 Only! Save your expensive time!

    July 28, 2018 at 8:21 am #15934
    theme-user
    Participant
    Purchased
    Expired

    Thank you for your answer.

    I believe, that you didn’t understaind my point.

    Making content to fit 50% of the page is easy, but making it to fit 50% on desktop and in the same time fitting to width on mobile is not.

    Let me show you:
    If desktop looks like that:
    https://ibb.co/c0X1PT

    Then mobile looks like that:
    https://ibb.co/m0t84T

    But I want to looks like that:
    https://ibb.co/dJYajT

    Also – your solution (which would be the best right now) with css is not working. Code inspector says that there is missing bracket. After adding it – it is still not working. Nothing is happening. I habe double checked if I have pasted proper post ID, and nothing changed.

    Icon WordPress Customization Service from $49 Only! Save your expensive time!

    July 31, 2018 at 6:57 pm #15976
    theme-user
    Participant
    Purchased
    Expired

    @BWSM are you able to help me with that please?

    Icon WordPress Customization Service from $49 Only! Save your expensive time!

    August 1, 2018 at 2:33 am #15977
    SeaTheme
    Keymaster
    Purchased
    Expired

    Hi,

    Please try to use Fullwidth wrap like: https://drive.google.com/open?id=1D5bsIcvOFUpbyEiZCF1IZwe6U_BFuhpH
    click settings of Fullwidth wrap, set “Inner Wrap Width” as 50%

    Please send your question and wp-admin(url/user/pass) via
    my profile contact form (you need login on ThemeForest), I’ll log in to check it.

    Regards!

    Icon WordPress Customization Service from $49 Only! Save your expensive time!

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