Plugin Author
DWUser
(@dwusercom)
Hi @supernaturalbrews,
To add a border around an entire rotator, the easiest solution is to edit the rotator’s layout code (instructions here) . In the Layout Source Code, insert the following new line at the very start:
<div style="position: absolute; left:0; right:0; top:0; bottom:0; border: 1px solid #000;"></div>
Please let me know if you have any other questions.
Sincerely,
Drew O’Neill
Drew,
I put the code in but it is not keeping the border. The border flashes really quick when it first loads but then disappears.
You can see it here:
http://www.kcnanobrews.com/
Thanks for you help. Awesome plugin btw.
also @dwuser.com ,
I figured out how to change the type and font but how do I change the size of the circles in the right bottom corner.
Thanks
Plugin Author
DWUser
(@dwusercom)
Hi,
To change the navigation dots, you’ll need to update each of the background-image declarations in these lines of code:
<div class="erdots_wrap" style="wasbackground-color: #CFC; float: right;" align="left">
<!-- modify the float on this element to make left/right/none=center aligned. -->
<span class="erdots_btn_selected" style="padding-left: 0; width: 21px; height: 20px; display: inline-block; text-align: center; vertical-align: middle; line-height: 20px; margin: 0 2px 0 0; cursor: default; background: url(http://easyrotator.s3.amazonaws.com/1/i/rotator/dots/export/20_14_wite_65.png) top left no-repeat;"> </span>
<span class="erdots_btn_normal" style="padding-left: 0; width: 21px; height: 20px; display: inline-block; text-align: center; vertical-align: middle; line-height: 20px; margin: 0 2px 0 0; cursor: pointer; background: url(http://easyrotator.s3.amazonaws.com/1/i/rotator/dots/export/20_14_wite_35.png) top left no-repeat;"> </span>
<span class="erdots_btn_hover" style="padding-left: 0; width: 21px; height: 20px; display: inline-block; text-align: center; vertical-align: middle; line-height: 20px; margin: 0 2px 0 0; cursor: pointer; background: url(http://easyrotator.s3.amazonaws.com/1/i/rotator/dots/export/20_14_wite_65.png) top left no-repeat;"> </span>
</div>
Sorry for the confusion regarding the border; to ensure that it remains visible, you should actually add the line I mentioned before at the very end of the layout code.
Sincerely,
Drew O’Neill
Plugin Author
DWUser
(@dwusercom)
(The formatter wrapped the text, which makes it hard to read. Here’s the unwrapped version: https://gist.github.com/anonymous/e2a25d02b10c1d831c00 )
Drew,
Thanks, but I put the border code at the bottom of the layout code and now I’ve lost my hyperlinks?
Plugin Author
DWUser
(@dwusercom)
Hi,
Sorry for the confusion; you shouldn’t use the <div> at the end approach if you have links, as it will block them. I see that you updated the rotator to include the border directly on the EasyRotator <div> which is another option. Or, you can wrap the entire rotator in code like this:
<div style="width: 600px; height: 400px; border: 1px solid #000;">
[easyrotator]erc_xx_xxxxx[/easyrotator]
</div>
The width/height values must match the rotator size.
Sincerely,
Drew O’Neill
