Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • June 25, 2015 at 12:01 am #464359
    Wils1234

    Hi Support,

    With respect to the mobile display…I would like to know how I can achieve a different look on the main page of the mobile and smart version please.

    Something like this.

    mobile header
    mobile menu – simple, not the one I use on desktop
    image to replace the slider
    Magazine element featuring 5 posts with main photo
    Magazine element featuring 5 portfolios with main photo
    Magazine element featuring 5 posts with main photo
    Magazine element featuring 5 portfolios with main photo
    Footer same as on desktop

    Thanks in advance

    June 26, 2015 at 10:36 am #464849
    Ismael

    Hi Wils1234!

    Thank you for using Enfold.

    Create another page then use this plugin to redirect to it when viewing on mobile devices: https://wordpress.org/plugins/simple-mobile-url-redirect/

    Please test it first before creating another page. If you don’t want a redirect, you can use css media queries to show or hide specific elements on different screen sizes. Turn on the custom css class.

    http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/

    Refer to this link for an example of the css media query technique: http://stackoverflow.com/questions/11796297/div-show-hide-media-query

    Regards,
    Ismael

    June 28, 2015 at 3:39 am #465413
    Wils1234

    Hi Ismael,

    We have used a banner logo of 768px width which takes us down to the IPAD. What I would like to do for the screen sizes below is to assign a specific size banner according to the screen with.

    We are using 318px to cover most mobiles, but not the tablets below iPAD. It shows up on these, but not across the full width of the screen, which we would like.

    add_filter(‘avf_logo’,’av_change_logo’);
    function av_change_logo($logo)
    {
    if(wp_is_mobile() )
    {
    $logo = “”;
    }
    return $logo;

    Thanks in advance.

    June 29, 2015 at 5:08 pm #465960
    Yigit

    Hey!

    Can you please elaborate on the logo issue you are having on mobile? I checked your website on my iphone and it does look fine. Different logo than desktop version.

    Best regards,
    Yigit

    June 29, 2015 at 6:28 pm #466008
    Wils1234

    Hi Yigit,

    Sorry I am learning as I go, I hope the attached screenshot helps.

    Thanks for you help.

    July 1, 2015 at 10:22 am #466876
    Andy

    Hi!

    you can try to work with media queries: https://css-tricks.com/snippets/css/media-queries-for-standard-devices/ as Ismael already mentioned. Look for the different devices and screen sizes. For iPad use something like this:

    @media only screen and (max-device-width: 1024px) {
strong.logo {
width: 20%;
}}

    Regards,
    Andy

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