Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #24106

    Hi,

    I need to do two things:

    1 – Increase the sidebar on ALL single portfolio item single page. It’s too narrow on the right today, and I need to increase its width so that it starts at the middle. Basically 50% for the image, 50% for the sidebar

    2 – Then for only a selected number of single portoflio item (selected by their ID and their are not in the same category), I’d like to show them fullwidth (i.e no sidebar for those few items single page only)

    I believe 1 is doable with CSS, but I can’t find where. Can you help please ?

    I don’t know how to implement 2… I’m happy to tweak the CSS if I can use the portofolio item ID somewhere. Alternatively, maybe there’s a plugin?

    Many thanks!

    #122337

    Hi,

    Looking at your site would be helpful because otherwise I will imagine your site being Angular demo http://www.kriesi.at/themes/angular/

    I will take what you said at face value and assume you are not talking about the ajax portfolio items that show up on same page.( like this type http://www.kriesi.at/themes/angular/portfolio-item/tongue-stuck/ )

    Size of main block is 610px in full width, and sidebar is 290px. so you want equality which will be 450px each.

    Here is the css for responsive layout. Please add it to your /css/custom.css or to Quick CSS located in Angular > Theme Options > Styling… the text box at the bottom of the page.

    /*
    
    Eqal Sidebar and Main
    */
    #top.single-portfolio .container .eight.units, #top.single-portfolio .container .four.units {
    width: 450px !important;
    }

    @media only screen and (max-width: 989px) and (min-width: 768px){
    #top.single-portfolio .container .eight.units, #top.single-portfolio .container .four.units {
    width: 342px !important;
    }}
    /*
    Full Image Code Below
    */
    #top.postid-385 .four.units {
    display: none;
    }
    #top.postid-385 .container .eight.units{
    max-width: 930px !important;
    }
    #top.postid-385 .slideshow.fade_slider {
    height: 930px!important;
    width: 930px !important;
    }
    /*
    Media Query 1
    */
    @media only screen and (max-width: 989px) and (min-width: 768px){
    #top.postid-385 .container .eight.units{
    width: 684px !important;
    }
    #top.postid-385 .slideshow.fade_slider {
    height: 684px !important;
    width: 684px !important;
    }}
    /*
    Media Query 2
    */
    @media only screen and (max-width: 767px) and (min-width: 480px){
    #top.postid-385 .container .eight.units{
    width: 460px !important;
    }
    #top.postid-385 .slideshow.fade_slider {
    height: 460px !important;
    width: 460px !important;
    }}
    /*
    Media Query 3
    */
    @media only screen and (max-width: 479px){
    #top.postid-385 .container .eight.units{
    width: 350px !important;
    }
    #top.postid-385 .slideshow.fade_slider {
    height: 350px !important;
    width: 350px !important;
    }}
    /*
    */

    =====================

    Your second request I can do either way in CSS or PHP, however I don’t know the ID numbers of the items you want to show full screen. That doesn’t matter though, I will give you the css and you add them in yourself based on the way i will have it set up, I added that css to the above, just needs to be tested.

    Thanks,

    Nick

Viewing 2 posts - 1 through 2 (of 2 total)

The topic ‘Single portfolio item page – Sideba and fullwidth’ is closed to new replies.