Image Resize

Tagged: 

This topic contains 12 replies, has 2 voices, and was last updated by  Alex 1 year, 3 months ago.

Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • #13056

    Denissa
    Participant

    http://prntscr.com/jyyveo

    http://prntscr.com/jyyvpm

    Hi is there a way to prevent course cards and blog post images being stretched?

    #13113

    Alex
    Keymaster
    This reply has been marked as private.
    #13122

    Denissa
    Participant
    This reply has been marked as private.
    #13160

    Alex
    Keymaster

    1. for this : please try adding this given code in your wplms-customizer.php file in wplms customizer plugin :

    https://gist.github.com/alexvibealex/4f4adffbddeb615e87d3962eeadb9031

     

    2. for this :

    please add this css in your src/pages/post/post.scss file :

    page-post img{width:100% !important;max-width:auto !important;height:auto;}

    #13440

    Denissa
    Participant
    This reply has been marked as private.
    #13484

    Alex
    Keymaster

    1. for this : please remnove the previously given code and  try adding this given code in your wplms-customizer.php file in wplms customizer plugin :

    https://gist.github.com/alexvibealex/4f4adffbddeb615e87d3962eeadb9031

     

    2. for this :

    please add this css in your src/pages/post/post.scss file :

    page-post img{width:100% !important;max-width:auto !important;height:auto;}

    #13724

    Denissa
    Participant

    First one still doesn’t work it makes the picture go into high quality only

    #13729

    Alex
    Keymaster

    try adding this css in your src/pages/course/course.scss file :

     

    page-course #featured > img{

        height:auto;

        min-height:auto;

    }

    #13788

    Denissa
    Participant

    http://prntscr.com/k7some

    It works just as I wanted, but in the course page only, can I apply the same code for home and directory section? Refer

    http://prntscr.com/k7sos6

    http://prntscr.com/k7sp5a

     

    2) http://prntscr.com/k2qxkh

    Problem still persist with the profile image, blog post works fine tho

    #13792

    Alex
    Keymaster

    for post image issue im sorry please remove this css :

    page-post img{width:100% !important;max-width:auto !important;height:auto;}

    and add this css in src/pages/post/post.scss file :

    page-post div img:not([lazy-load]){width:100% !important;max-width:auto !important;height:auto;}

     

    #13793

    Alex
    Keymaster

    for course directory page im sorry we cannot fix that .This is the best optimization we could do for the image to fit there in that width .

    If we make the image appear in original proportion which is rectangle it will appears like this : http://prntscr.com/k7vihp

    ARe you ok with it ?

    #13828

    Denissa
    Participant

    Yes, we’ll take it.

    How about the homepage?

    #13868

    Alex
    Keymaster

    Try adding this css in your src/theme/variable.scss :

     

    page-directory courseblock .course_block .course_featured_image{

        background-size:contain !important;

        background-repeat:no-repeat;

    }

     

    page-home #featured img{

        height:auto !important;

        width:100%;

        min-height:initial;

    }

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

You must be logged in to reply to this topic.

Template Design © VibeThemes. All rights reserved.