Side bar in archive being moved and content not in container

  • Resolved sebastainvdn

    (@sebastainvdn)


    3 years, 9 months ago

    Hey, so I was wondering if there are any solutions for my issue. I need to fix the styling of the mentioned page. One way to do this would be using shortcodes (if those exist for those pages?). I know it exists for the page recipe-search. Are there also shortcodes for the other pages?

    Else, how can I fix this issue?

    Thanks.

    The page I need help with: [log in to see the link]

Viewing 8 replies - 1 through 8 (of 8 total)
  • Plugin Author WP Delicious

    (@wpdelicious)

    Hi @sebastainvdn,

    There are no shortcodes for other pages. Instead, there is option to assign the page templates which you have already done.

    You can add the below CSS code to fix the issue via Appearance > Customize > Additional CSS.

    .nv-sidebar-full-width #primary,
.nv-sidebar-right #primary{
    float: left;
    width: calc(100% - 350px);
    padding-right: 100px;
}
.page-template .neve-main{
    max-width: 1218px;
    margin: 60px auto;
    display: flex;
    flex-wrap: wrap;
}

.nv-sidebar-full-width .nv-blog-sidebar,
.nv-sidebar-right .nv-blog-sidebar{
    float: right;
    width: 350px;
}

@media screen and (max-width: 1024px){
   .nv-sidebar-full-width .nv-blog-sidebar,
    .nv-sidebar-right .nv-blog-sidebar{
    float: none;
    width: 100%;
} 
    .page-template .neve-main{
    max-width: 768px;
    padding: 0 15px;
}
    .nv-sidebar-full-width #primary,
    .nv-sidebar-right #primary{
    float: none;
    width: 100%;
    padding-right: 0;
    margin-bottom: 60px;
}
}

@media screen and (max-width: 767px){
    .page-template .neve-main {
    max-width: 420px;
    padding: 0 15px;
        margin: 0;
}
}

    Please add the above code and let us know if you face any other issues.

    • This reply was modified 3 years, 9 months ago by WP Delicious.
    Thread Starter sebastainvdn

    (@sebastainvdn)

    Thank yo so much!!

    Thread Starter sebastainvdn

    (@sebastainvdn)

    For some pages the code worked others look worse, these pages seem to be wrong:
    https://thebgang.com/recipe-cooking-methods/
    https://thebgang.com/recipe-cuisines/
    https://thebgang.com/recipe-tags/

    Thread Starter sebastainvdn

    (@sebastainvdn)

    Also all my other pages look verry modified now I don’t want that

    Plugin Author WP Delicious

    (@wpdelicious)

    Hi @sebastainvdn,

    Please remove the earlier code and add the below code:

    .page-template-recipe-cooking-methods.nv-sidebar-full-width #primary,
.page-template-recipe-cooking-methods.nv-sidebar-right #primary,
.page-template-recipe-cuisines.nv-sidebar-full-width #primary,
.page-template-recipe-cuisines.nv-sidebar-right #primary,
.page-template-recipe-tags.nv-sidebar-full-width #primary,
.page-template-recipe-tags.nv-sidebar-right #primary,
.page-template-recipe-keys.nv-sidebar-full-width #primary,
.page-template-recipe-keys.nv-sidebar-right #primary,
.page-template-recipe-courses.nv-sidebar-full-width #primary,
.page-template-recipe-courses.nv-sidebar-right #primary{
    float: left;
    width: calc(100% - 350px);
    padding-right: 100px;
}

.page-template-recipe-cooking-methods.nv-sidebar-full-width .neve-main,
.page-template-recipe-cooking-methods.nv-sidebar-right .neve-main,
.page-template-recipe-cuisines.nv-sidebar-full-width .neve-main,
.page-template-recipe-cuisines.nv-sidebar-right .neve-main,
.page-template-recipe-tags.nv-sidebar-full-width .neve-main,
.page-template-recipe-tags.nv-sidebar-right .neve-main,
.page-template-recipe-keys.nv-sidebar-full-width .neve-main,
.page-template-recipe-keys.nv-sidebar-right .neve-main,
.page-template-recipe-courses.nv-sidebar-full-width .neve-main,
.page-template-recipe-courses.nv-sidebar-right .neve-main{
    max-width: 1218px;
    margin: 60px auto;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}

.page-template-recipe-cooking-methods.nv-sidebar-full-width .nv-blog-sidebar,
.page-template-recipe-cooking-methods.nv-sidebar-right .nv-blog-sidebar,
.page-template-recipe-cuisines.nv-sidebar-full-width .nv-blog-sidebar,
.page-template-recipe-cuisines.nv-sidebar-right .nv-blog-sidebar,
.page-template-recipe-tags.nv-sidebar-full-width .nv-blog-sidebar,
.page-template-recipe-tags.nv-sidebar-right .nv-blog-sidebar,
.page-template-recipe-keys.nv-sidebar-full-width .nv-blog-sidebar,
.page-template-recipe-keys.nv-sidebar-right .nv-blog-sidebar,
.page-template-recipe-courses.nv-sidebar-full-width .nv-blog-sidebar,
.page-template-recipe-courses.nv-sidebar-right .nv-blog-sidebar{
    float: right;
    width: 350px;
}

@media screen and (max-width: 1024px){
   .page-template-recipe-cooking-methods.nv-sidebar-full-width .nv-blog-sidebar,
    .page-template-recipe-cooking-methods.nv-sidebar-right .nv-blog-sidebar,
    .page-template-recipe-cuisines.nv-sidebar-full-width .nv-blog-sidebar,
    .page-template-recipe-cuisines.nv-sidebar-right .nv-blog-sidebar,
    .page-template-recipe-tags.nv-sidebar-full-width .nv-blog-sidebar,
    .page-template-recipe-tags.nv-sidebar-right .nv-blog-sidebar,
    .page-template-recipe-keys.nv-sidebar-full-width .nv-blog-sidebar,
    .page-template-recipe-keys.nv-sidebar-right .nv-blog-sidebar,
    .page-template-recipe-courses.nv-sidebar-full-width .nv-blog-sidebar,
    .page-template-recipe-courses.nv-sidebar-right .nv-blog-sidebar{
        float: none;
        width: 100%;
    } 
    .page-template-recipe-cooking-methods.nv-sidebar-full-width .neve-main,
    .page-template-recipe-cooking-methods.nv-sidebar-right .neve-main,
    .page-template-recipe-cuisines.nv-sidebar-full-width .neve-main,
    .page-template-recipe-cuisines.nv-sidebar-right .neve-main,
    .page-template-recipe-tags.nv-sidebar-full-width .neve-main,
    .page-template-recipe-tags.nv-sidebar-right .neve-main,
    .page-template-recipe-keys.nv-sidebar-full-width .neve-main,
    .page-template-recipe-keys.nv-sidebar-right .neve-main,
    .page-template-recipe-courses.nv-sidebar-full-width .neve-main,
    .page-template-recipe-courses.nv-sidebar-right .neve-main{
        max-width: 768px;
        padding: 0 15px;
    }
    
    .page-template-recipe-cooking-methods.nv-sidebar-full-width #primary,
    .page-template-recipe-cooking-methods.nv-sidebar-right #primary,
    .page-template-recipe-cuisines.nv-sidebar-full-width #primary,
    .page-template-recipe-cuisines.nv-sidebar-right #primary,
    .page-template-recipe-tags.nv-sidebar-full-width #primary,
    .page-template-recipe-tags.nv-sidebar-right #primary,
    .page-template-recipe-keys.nv-sidebar-full-width #primary,
    .page-template-recipe-keys.nv-sidebar-right #primary,
    .page-template-recipe-courses.nv-sidebar-full-width #primary,
    .page-template-recipe-courses.nv-sidebar-right #primary{
        float: none;
        width: 100%;
        padding-right: 0;
        margin-bottom: 60px;
    }
}

@media screen and (max-width: 767px){
    .page-template-recipe-cooking-methods.nv-sidebar-full-width .neve-main,
    .page-template-recipe-cooking-methods.nv-sidebar-right .neve-main,
    .page-template-recipe-cuisines.nv-sidebar-full-width .neve-main,
    .page-template-recipe-cuisines.nv-sidebar-right .neve-main,
    .page-template-recipe-tags.nv-sidebar-full-width .neve-main,
    .page-template-recipe-tags.nv-sidebar-right .neve-main,
    .page-template-recipe-keys.nv-sidebar-full-width .neve-main,
    .page-template-recipe-keys.nv-sidebar-right .neve-main,
    .page-template-recipe-courses.nv-sidebar-full-width .neve-main,
    .page-template-recipe-courses.nv-sidebar-right .neve-main {
        max-width: 420px;
        padding: 0 15px;
            margin: 0;
    }
}

    The above code will only modify those page templates. If you still face any issues, please reach out to our support team for further assistance..

    Thread Starter sebastainvdn

    (@sebastainvdn)

    That works thank you so much :).

    Plugin Author WP Delicious

    (@wpdelicious)

    Hi @sebastainvdn,

    We are glad to hear that your issue is resolved. If you face any issues, do let us know.

    Can you please share your valuable feedback by leaving a review for our plugin?

    Click here to review

    Thread Starter sebastainvdn

    (@sebastainvdn)

    I sure will thanks for the amazing support!

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Side bar in archive being moved and content not in container’ is closed to new replies.