Okay
  Public Ticket #1937419
yellow pencil left tool bar
Closed

Comments

  • abdulbs1 started the conversation

    hi i have bought Yellow Pencil pro.


    Please see the attachment and tell me how to change the position of left side tool bar so i can get full live experience.

    see in picture No. 1

  •  435
    David replied

    Hi,

    You can't change the position of that bar. You already have full live experience, that bar takes so little of your screen.

    Best regards,
    WaspThemes team

    And don't forget to rate our plugin, it means a lot to us!

  • abdulbs1 replied

    ok friend thanks.

    Yellow pencil is very good for live css more than CSS Hero and Siteorigin Css.

    but at least tell me. how i apply hover effect in Yellow pencil like Aliexpress.com products. i give you link look care fully that before hover mouse cursor the product have only 2 line product description and when cursor of mouse hover on any product it's block extend to down and show complete description of product. so please tell me using Yellow Pencil how i apply this hover effect on my website products. because my product title is very long. and you can see in CSS Hero plugin have some hover effects.

    check the link.

    https://www.aliexpress.com/category/100003084/hoodies-sweatshirts.html?spm=2114.11010108.102.3.650c649b0cC2HF

    check the link check the attachment picture and video.


    i hope you can understand my English.

    thanks reply quickly.

  •  435
    David replied

    Hi,

    That can be achieved in this way.

    1. Select the element holding text (title or description) and set it's height in a way where two lines are shown.

    2. Then make hover action on parent element and affect child element and extend it's height.

    If you can't achieve that in YP, just send me your website URL and I'll send you custom code since this can be tricky with YP, as it's advanced CSS technique.

    Best regards,
    WaspThemes team

    And don't forget to rate our plugin, it means a lot to us!

  • abdulbs1 replied

    please tell me proper way of doing this. your support is very good more than kutetheme.com

    tell me the proper steps even in Yellow pencil or any Css Code for doing this. please teach me in videos or screen shot with Yellow pencil or Css code with step by step.


    my website url is

    https://saifmall.com

  •  435
    David replied

    Your website is unreachable?

    3728685423.png


    Best regards,
    WaspThemes team

    And don't forget to rate our plugin, it means a lot to us!

  • abdulbs1 replied

    my friend this is not my site kutetheme.com . i am just telling you that your support is very good more than kethemes.com


    my website is 

    https://saifmall.com

  •  435
    David replied

    Sorry!

    I checked your website and you have titles stripped meaning that your HTML code renders only 2 lines of text. So I can set one line to be visible before hover, and two lines when on hover. Is that okay?

    Best regards,
    WaspThemes team

    And don't forget to rate our plugin, it means a lot to us!

  • abdulbs1 replied

    yes my friend. you see only 2 line because i use a plugin Woo Title Limite and i set the character limit. so right now i am deactivating this plugin and now you can see my products have 4 or 5 line. so 

    please

    set it for me before hover 2 line product titile. like this...

    https://www.aliexpress.com/category/100003084/hoodies-sweatshirts.html?spm=2114.11010108.102.3.268c649bA8MQvq

    and after hover show complete product title.

    if you are using Css or any plugin or using Yellow Pencil, at least tell me the detail step by step thanks.


    so check again my website.



  •  435
    David replied

    Here you go. First code makes fixed height, and second expands it on hover. Just paste that code in your CSS Editor and you're good to go!

    .product-item .product-name {
        height: 40px;
        overflow: hidden;
    }

    .product-item:hover .product-name {
        height: auto;
    }


    Best regards,
    WaspThemes team

    And don't forget to rate our plugin, it means a lot to us!

  • abdulbs1 replied

    you are awsome.

    great. '

    thanks a lot


  •  435
    David replied

    Thank you! Have a great day!

    Best regards,
    WaspThemes team

    And don't forget to rate our plugin, it means a lot to us!

  • abdulbs1 replied

    thnaks this is a goodd css for 2 line and make the product title visible short.

    one more thing i need help. if you see this link

    https://www.aliexpress.com/category/100003084/hoodies-sweatshirts.html?spm=2114.11010108.102.3.268c649bA8MQvq

    you can see only each product block separately stretch down not the full product row.

    but if you see in my website shop page.

    https://saifmall.com/shop/

    when i hover on any product the whole row stretch down not only the each product block if there is any way in yellow pencil or css.

    i think you can understand what i want to say.

  •  435
    David replied

    That's best done with some jQuery. With CSS you can set min-height but need to target bunch of screen resolutions. jQuery can handle that easily.

    http://tsvensen.github.io/equalize.js/

    Best regards,
    WaspThemes team

    And don't forget to rate our plugin, it means a lot to us!

  • abdulbs1 replied

    how to use this js Query.

    i don't understand.


  •  435
    David replied

    Sorry, then you can hire some freelance developer to make that for you or some plugin perhaps. Or after all you can add min-height and set it for different screen sizes.

    Our official support policy is not to customize user websites so I can't install JS for you and make it work, that's on to you. I hope you understand.

    Best regards,
    WaspThemes team

    And don't forget to rate our plugin, it means a lot to us!

  • abdulbs1 replied

    ok no problem

    thanks for help

    thanks a lot

  •  435
    David replied

    Thank you! Have a great day!

    Best regards,
    WaspThemes team

    And don't forget to rate our plugin, it means a lot to us!