Black Title line covers photos

  • Resolved Adalinka

    (@adalinka)


    9 years, 3 months ago

    I really like this plugin, but I have some issues when viewing on cellphones. The black bar that shows the Title/name of the image , covers almost entire image on the cellphone screen. (Tried 5.5″ screen and 4″ etc). Only when I move the phone into landscape than the slideshow looks ok. Is there any way to fix it? So it looks nice both way on cellphone-in landscape and portrait mode? Thank you.

    https://wordpress.org/plugins/easyrotator-for-wordpress/

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

    (@dwusercom)

    9 years, 3 months ago

    Hi Adalinka,

    Thanks for using EasyRotator! Some layouts may appear better on mobile devices if small adjustments are made to the layout code. Can you please send the URL of your page so I can make recommendations?

    Sincerely,
    Drew O’Neill

    Thread Starter Adalinka

    (@adalinka)

    9 years, 3 months ago

    HI. Thank you very much. Here is the link with one if the slideshows: http://robkconstruction.com/portfolio/basements/

    I really appreciate any suggestions and help. 🙂

    Plugin Author DWUser

    (@dwusercom)

    9 years, 3 months ago

    Hi,

    It looks like this template originally had a category selector, which has resulted in the extra space at the top. You’ll want to make the following adjustments to the layout code ( http://www.dwuser.com/support/easyrotator/kb/customize-layout/ ):

    On the first line, adjust the top value to be 0:

    <div class="erimgMain" style="position: absolute; left:0;right:0;top:40px;bottom:70px;" ...
    Becomes:
    <div class="erimgMain" style="position: absolute; left:0;right:0;top:0;bottom:70px;" ...

    Then, a few lines later, adjust the bottom value for the image display:

    <div class="erimgMain_img" style="position: absolute; left: 0; right: 0; top: 0; bottom: 0;"></div>
    Becomes:
    <div class="erimgMain_img" style="position: absolute; left: 0; right: 0; top: 0; bottom: 40px;"></div>

    That should adjust the image position so that overlap is avoided in mobile view.

    Sincerely,
    Drew O’Neill

    Thread Starter Adalinka

    (@adalinka)

    9 years, 3 months ago

    Thank you very much. I will definitely try this. I hope it will work. 🙂

    Thread Starter Adalinka

    (@adalinka)

    9 years, 3 months ago

    I was doing those changes to few slideshows from web site, but unfortunately it doesn’t seem to work. Still the same issue.YThe black lines covers the image.And image is really small. I wish to add a screen shot,so you can see it. :/

    Thread Starter Adalinka

    (@adalinka)

    9 years, 3 months ago

    And what about those lines of codes:

    <p class=”erimgMain_title” style=”padding: 0; margin: 0 0 3px 0; font-weight: bold;”></p>
    <p class=”erimgMain_desc” style=”padding: 0 0 10px 0; margin: 0;”></p>
    </div>

    or

    <!– <div class=”” style=”background: #555; position: absolute; left: 1px; right: 1px; top: 10px; bottom: 0; padding: 5px; color: #FFF; font-family: Arial; font-size: 12px; text-align: center;”>
    <p class=”erimgMain_title” style=”padding: 5px; margin: 0 0 3px 0; font-weight: bold;”></p>

    Wouldn’t they be the one to actually edited? I really wish the line wasnt covering the images on cellphone. 🙁

    Thread Starter Adalinka

    (@adalinka)

    9 years, 3 months ago

    Ok. I am sorry. But I think it actually works. 🙂 I just noticed that when I click on some of the folders they point to wrong folder. So when I was editing the easy rotator I couldn’t see the changes.. I should be good now. Thank you. 🙂

    Plugin Author DWUser

    (@dwusercom)

    9 years, 3 months ago

    Thanks for the update! Feel free to get in touch again in the future if you experience any other issues.

    Sincerely,
    Drew O’Neill

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Black Title line covers photos’ is closed to new replies.