› ›

Image Heder Issue + page Title Display

mgregoire83mgregoire83
in wallstreet
Hi !

1 - I've a display problem on Page Header :


Please refer to the attached PDF.

2 - I need to know also, how to hide the title of a specific Page

Regards

MG
Page-Image-Header-BG-Issue.pdf
705K
Tagged:

Comments

  • akhileshakhilesh
    Hey 

    The breadcrumbs bar  moved top bz you added the below css code . 
    .page-header-title {
    1. display: none;
    }

    For hiding the title . 
    Let take step by step . 
    Firstly remove the  above css code . 

  • akhileshakhilesh
    HI 

    To fix the image repetition problem . 
    Add the below css code inside the custom css box . 

    .page-mycarousel {
        background-repeat: no-repeat ! important;
        background-position: center center ! important;
        -webkit-background-size: cover ! important;
        background-size: cover ! important;
    }

    Thanks 
  • akhileshakhilesh
    Hi 
    If you want to hide header title on specific page . 
    Find the page id of respective page from which you want to hide page id . 

    Then add the below css code inside the custom css box . 

    .page-id-60 .page-header-title h1 { display: none ; }
    .page-id-60 . .page-title-col { top: 45% ! important; }

    Change page id as your need  and  also change top value . 

    Thanks 




  • mgregoire83mgregoire83
    Hi,

    You say :

    The  moved top bz you added the below css code . 

    .page-header-title {
    1. display: none;
    }

    -----------------------------------

    Hi !
    I've removed this code, but breadcrumbs bar still stay located at the wrong place (should be bottom).
    Thanks !


  • mgregoire83mgregoire83
    Hi again !

    The cache was not flushed, sorry ! The breadcrumb is now at the good position !

    Thanks !

    regards
  • mgregoire83mgregoire83
    I try to hide the title with the code above

    .page-id-60 .page-header-title h1 { display: none ; }
    .page-id-60 . .page-title-col { top: 45% ! important; }

    But the breadcrumb position issue stay the same !


    Regards !

  • mgregoire83mgregoire83
    Hi again !

    I've also an issue regarding the header image. The image is 1600x400 (as requested), but the displayed image (in 1024x768) is not correct. The right part of this image is not displayed !

    Regards
  • mgregoire83mgregoire83
    I've tried those changes :

    .page-mycarousel {
        background-repeat: no-repeat ! important;
        background-position:right center ! important;
        -webkit-background-size: cover ! important;
        background-size: cover ! important;
    }

    .page-breadcrumbs {
        margin-top: 55px;
        min-height: 60px;
        width: 100%;
        position: relative;
    }

    Is that right ?

    Regards

    MG
  • akhileshakhilesh
    Hi 

    After hiding the title on the page  . 
    Add the  below css code for positioning the breadcrumb . 

    .page-id-2.page-title-col { top: 54% ! important; }

    Thanks 
  • akhileshakhilesh
    Hi 

    This is not  correct pls remove the css you  send  us . 
    .page-breadcrumbs {
        margin-top: 55px;
        min-height: 60px;
        width: 100%;
        position: relative;
    }

    Don't add this css code , it will effect on the responsive feature of the site . 

    Thanks 
  • akhileshakhilesh
    HI  @mgregoire83 

    Dear for your header image size issue in 1024x768  screen size resolution .
    For this create separate ticket . 
    Bz multiple issue in single  thread create complexity to handle better support query . 

    Thanks 
  • mgregoire83mgregoire83
    OK ! Breadcrumb position issue solved ! Thanks !

    For the image header background, the background-position : right solution works for me :

    .page-mycarousel {
        background-repeat: no-repeat ! important;
        background-position:right center ! important;
        -webkit-background-size: cover ! important;
        background-size: cover ! important;
    }

    Does-it have a negative impact for the theme ?

    Ragards

    MG
  • akhileshakhilesh
    Hi 

    There is no negative impact . 
    You can Use
       background-position:right center ! important;  

    Css code . 

    If you allow can I close this ticket ?


    Thanks 
  • mgregoire83mgregoire83
    Hi !

    I'm very disappointed but the breadcrumb is still not displayed the right place !

    Page where the issue appears :



    Regards

    MG
  • mgregoire83mgregoire83
    The :

    .page-id-2.page-title-col { top: 54% ! important; } doesn't work anymore !

    Please give me the solution ?

    URGENT !

    Regards
  • akhileshakhilesh
    Hi 

    Again add the below css code . We need space between like (.page-id-2  .page-title-col) .

    Any way add code and tell me . 

    .page-id-2  .page-title-col { top: 54% ! important; }

    .page-id-207 .page-title-col { top: 54% ! important; }  

    Hope it will  work for you . 

    Thanks 

  • mgregoire83mgregoire83
    Thanks it works properly now !


    You can close this ticket !

    Regards


  • mgregoire83mgregoire83
    Hi again !

    After verification there is an issue with the breadcrumb, in the post detailed display:


    Many thanks !

    Regards

    MG
  • akhileshakhilesh
    HI 
    Its showing perfect at our end . 
    See the snapshot http://prntscr.com/dxxxhq


    Thanks 
  • mgregoire83mgregoire83
    It's OK now !

    Thanks a lor !

    Regards

    MG
This discussion has been closed.