Making Canvas non responsive?

Tagged: ,

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #7056
    Nick Hill
    Participant

    Hi Jamie,

    I hope you are well!

    Thanks for helping me start to get Canvas to be non-responsive. The CSS you suggested I use was:

    @import url(css/layout.css);
    .col-full, #wrapper { max-width: 960px; width: 960px; }
    #top select { display: none !important; }

    The site I’m currently working on is bcslearning.net/ict. I have two screenshots here but am not quite sure how to attach to this post so I have put them on the homepage of the site itself – underneath the test post about the Apogee Duet! Could you possibly take a look?

    If I look at the PootlePress site on both iPhone and iPad it fits very nicely on both devices whereas my site doesn’t. Would you be able to help me fix this, please? The iPhone screenshot looks to me as if it is still trying to be responsive. The iPad screenshot shows the site just doesn’t quite fit on the screen in portrait. If you try to resize it it then resizes itself when you go to a different page.

    The PootlePress site looks to me (a novice) as if it’s been done in Canvas. I would love to have mine set up the same so it behaves itself: ie fits beautifully on desktops, iOS devices and anything else that it’s viewed on.

    The entire Custom CSS currently on the site is shown below which is a mixture of what you suggested and what the guys at WooThemes have suggested:

    .page-id-8 .title {
    display: none;
    }

    @media only screen and (max-width: 767px) {
    #header {
    padding-bottom: 0;
    background-size: 100%;
    }
    #header .nav-toggle {
    margin: 1em 0 0;
    }
    #logo {
    margin-top: 1em;
    visibility: hidden;
    }
    }

    @media only screen and (min-width: 768px) {
    #navigation {
    margin-bottom: 1em;
    }
    #content {
    padding: 0;
    }
    }

    @import url(css/layout.css);
    .col-full, #wrapper { max-width: 960px; width: 960px; }
    #top select { display: none !important; }

    Thanks,

    Nick

    #7058
    Jamie Marsland
    Keymaster

    Hi Nick,

    A couple of things to try

    1) You need to make sure the @import url code is at the top of your custom.css file (not at the bottom)

    2) Try adding this to your functions.php (in the place where it tells you to add it)

    remove_action( ‘wp_head’, ‘woo_load_responsive_meta_tags’, 10 );

    I’m testing this right now and this combination seems to work with the latest version of Canvas, but I haven’t tested fully :)

    Jamie

     

    #7059
    Nick Hill
    Participant

    Hi Jamie,

    I have done both of those things and it appears to have worked a treat so thank you very much indeed!

    I am beginning to think that a session on our Learning Zones where you have a good look at what we are trying to achieve might be a sensible way forward. Things like, as a school community, should we be locking down the whole WP MU installation and having staff and children subscribing etc?

    If you think this would be a good move can you let me know what options are available, please? I have got this far with quite a bit of time devoted already – we have 7 sites all in various degrees of completion and an expert eye with some suggestions for improvement and moving it all forward might just be what’s required. Another we did for a recent choir tour is bcslearning.net/umbria2012.

    Let me know.

    Thanks,

    Nick

    #7060
    Nick Hill
    Participant

    Hi Jamie,

    I have just had another look at bcslearning.net/ict on iPad and iPhone and sometimes the site translates ok and sometimes it doesn’t so may be the fix hasn’t quite worked.

    Thanks,

    Nick

    #7739
    Nick Hill
    Participant

    Hi Jamie,

    Can you take a look at this again. I am trying to remove the responsiveness from the Canvas theme because our sites (bcslearning.net) don’t seem to be translating well.

    I did the remove_action thing you suggested earlier in this thread but the custom.css one didn’t work!

    Help!

    #7746
    Jamie Marsland
    Keymaster

    Hi Nick,

    Actually this has been improved a great deal with the latest version of Canvas (Canvas v5.0.13 and higher). I recommend you update your theme and then use this code in functions.php (place below where it says “You can add custom functions below”) to remove responsiveness http://pastebin.com/PR0Vu21V.

    Jamie

    #7750
    Nick Hill
    Participant

    Hi Jamie,

    This looks as if it’s worked so thank you.

    Would you be able to take a look at:

    http://bcslearning.net/english/category/childrens-work-year-3/

    and let me know how to 1. Remove the wording Archive | and 2. How to change the colour to our default Blue?

    Thanks,

    Nick

    #7757
    Jamie Marsland
    Keymaster

    Here you go, put this is custom.css

    .archive_header {
    display: none;
    }

    You should be able to change the colours through theme options, or you could put into css above.

    Jamie

    #7758
    Nick Hill
    Participant

    Hi Jamie,

    Is it possible to remove the Archive | bit but leave the actual title like Children’s Work: Year 4

    Thanks

Viewing 9 posts - 1 through 9 (of 9 total)
  • You must be logged in to reply to this topic.
Scroll to Top