Home Forums Weaver Show Posts & Show Sliders Post Slider does not respond to CSS

Topic Resolution: Resolved
Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #63166
    Yvonne
    Participant

    Post Slider does not respond to your own CSS settings.

    https://portowaduma.pl

    .this-slider .entry-meta {display:none;} /* remove the message buble */
    .this-slider .slide-content {position:relative;} /* sets the reference for the absolute positioning of the title */
    .this-slider .entry-header {text-align:center;margin-top:10px;position:absolute;bottom:0px;} /* move the title at the bottom */
    .this-slider .slide-post {margin:0;} /* remove default margin on the image */
    .this-slider .atwk-viewport {padding:0px 0;} /* add space above and below the images */
    .this-slider .post-title {margin-top:-38px !important; font-size:16px;background-color:rgba(100,100,100,0.9); height:38px; z-index:2000;position:relative;}
    .this-slider .entry-header {width:100%;}
    .this-slider .post-title a {color:#010101!important;font-family: ‘Rubik’;!important;line-height: 1;}

    #63170
    scrambler
    Moderator

    You will need to be more precise here.

    What do you mean by Your CSS settings? If you are referring to some guide article, please explain which one

    Now, the slider I see at the top of the page has the following custom CSS rules

    .atwkslider-default .slides .atwk-slide .slide-image .atwk-title-overlay{max-width:75%}
    .atwkslider-default .slides .atwk-slide .slide-image img {width:100%;}
    .atwkslider-default{-webkit-box-shadow:none;-moz-box-shadow:none;-o-box-shadow:none;box-shadow:none;}
    .atwkslider-default,.atwkslider-default-thumbs{width:100%;margin-left:auto;margin-right:auto;}
    .atwkslider-default-thumbs{max-width:100.000%;margin-left:auto;margin-right:auto;}
    .atwkslider-default .atwkslider .atwk-control-nav{margin-bottom:0em !important;}.atwkslider-default .atwkslider .atwk-direction-nav{margin-bottom:0em !important;}body .atwkslider .atwk-direction-nav{margin-bottom:0em !important;}body .atwkslider .atwk-control-nav{margin-bottom:0em !important;}.atwkslider{margin-bottom:0 !important;}.atwkslider-default .atwk-direction-nav a,.atwkslider-default-thumbs .atwk-direction-nav a {background:url(https://portowaduma.pl/wp-content/plugins/show-sliders/flex/images/nav-12.png) no-repeat 0 0;}.atwkslider-default .atwk-direction-nav .atwk-next,.atwkslider-default-thumbs .atwk-direction-nav .atwk-next  {background-position: 100% 0;}
    .atwkslider-default .entry-meta {display:none;}  /* remove the message buble */
    .atwkslider-default .slide-content {position:relative;} /* sets the reference for the absolute positioning of the title */
    .atwkslider-default .entry-header {text-align:center;position:absolute;bottom:-30px;} /* move the title at the bottom */
    .atwkslider-default .slide-post {margin:0;} /* remove default margin on the image */
    .atwkslider-default .atwk-viewport {padding:50px 0;} /* add space above and below the images */
    .atwkslider-default .post-title {margin-top:-50px !important;color:#FFFFFF!important;font-family:”Roboto”!important; font-size:16px; background-color:rgba(100,0,0,0.4);z-index:2000;position:relative;}

    Which are not quite the ones you mention

    Also that slider is displaying as images not posts, so some of these rules do not apply (slide-post, meta, post-title, entry-header…).

    The ones that do are active and working.

    So first make sure you are looking at the CSS that is in the slider in question. If not the one at the top of  the page you linked to, please provide a  link and where to look.

    Next if you are using rules to format a post slider, make sure the slider is set to display as posts and not as images.

     

     

    #63178
    Yvonne
    Participant

    I did everything, but unfortunately the pictures are cut from above in each slider (fade, carousel, slider)

    #63179
    scrambler
    Moderator

    You really need to be more detailed…

    What are you trying to do exactly?

    And the slider in your page right now is no longer a weaver slider

    We are happy to help, but we don’t read minds 🙂

    #63180
    Yvonne
    Participant
    Images are cut off and the height is set to a maximu of 800 px, probably only shows 100px
    on the smartphone is quite ok
    #63182
    scrambler
    Moderator
    You need to tell me what you want the posts to look like!
    If you want the image full size and the post title over the image at the bottom, change the rules as below 
    .this-slider .entry-meta {display:none;} /* remove the message buble */
    .this-slider .slide-content .entry-header {position:relative;} /* sets the reference for the absolute positioning of the title */
    .this-slider .entry-header .post-title {width:100%;text-align:center;position:absolute;bottom:0px;margin-bottom:0;} /* move the title at the bottom */
    .this-slider .slide-post {margin:0;} /* remove default margin on the image */
    .this-slider .atwk-viewport {padding:5px 0;} /* add space above and below the images */
    .this-slider .post-title {font-size:15px;background-color:rgba(100,100,100,0.9); height:40px;padding-top:20px;}/* size and color of backgd and text position */
    .this-slider .post-title a {color:#FFFFFF!important;font-family: ‘Rubik’;!important;line-height: 0;}
    But for me to help fine tune the CSS, you need to describe precisely how you wan to display the image, the title and the excerpt
    #63196
    Yvonne
    Participant

    wow. now is superrrr. Thank you, thank you, thank you.
    Only one request: I do not want the slider to display post fragments (Excerpt)

    #63199
    scrambler
    Moderator

    You can add the rule below to the others

    .this-slider .entry-summary {display:none;} /* remove the excerpt */

     

    #63204
    Yvonne
    Participant

    SSSSSUPPPPERR. Thank you

    #63175
    Private Reply
    Yvonne
    Participant
    This reply has been marked as private.
Viewing 10 posts - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.