Viewing 15 posts - 1 through 15 (of 15 total)
  • Author
    Posts
  • #282778

    I can’t believe its come to this for what should be a simple adjustment within the theme itself but here it goes…

    Where are the options for changing the “caption” style?? Example: You have the option to include a caption with your video slide but the text is small, color white, and it automatically puts a transparent background behind. That’s not a problem IF we can change these options. (i.e. transparency, font color, size etc.). I would like to be able to enlarge (or adjust) the text size and font (without effecting other areas), have the transparency enlarge to fit the adjustment (or not have it at all). There of course many other issues I need help with but I’ll leave it that for now. Can you help with this?

    Thanks
    Joe

    #282779

    Oh… by the way, the caption in question is the main video slider here: http://collinssafety.ca/wp/

    #282841

    Hi!

    Thank you for visiting the support forum!

    I’m sorry but that’s all the available options for the sliders right now. If you want to request for more added features, you can visit the Feature Requests page. Anyway, if you can provide us with a screenshot of what you want to accomplish with the slider captions, we might be able to help.

    Cheers!
    Ismael

    #282869

    Well I thought explaining what I wanted to accomplish as well as providing you with a link to the video slider and caption in question would be sufficient…but apparently that was not clear enough and you now need a picture too? Forgive me but I’m confused about what more I could possibly provide. Not sure what you want to see in a picture (screenshot) since I CANNOT make the necessary changes to illustrate what I need…so I created a screenshot (as per your request) with a big red circle around the said “caption” and more text that I hope will finally make the request more clear. However, we have a little problem…

    Perhaps you could help me by providing details on just HOW I’m supposed to provide you with screenshot when there is no provision for attachments?

    Thank you?
    Joe

    #282912

    Hey!

    Thank you for the update.

    Alright. I thought you’re asking for additional options on the slider panel. Anyway, if you want to change the transparency, font size, font color etc. You can use this on Quick CSS or custom.css:

    Caption Title:

    .caption_framed .slideshow_caption .avia-caption-title {
    background: rgba(0,0,0,.8);
    font-size: 50px !important;
    color: blue;
    }
    

    Caption Text:

    .caption_framed .slideshow_caption .avia-caption-content {
    background: rgba(0,0,0,.8);
    font-size: 20px !important;
    color: red;
    }

    You can use imgur, dropbox etc. if you need to post a screenshot. Thank you.

    Best regards,
    Ismael

    #283138

    Hi Ismael,
    Thank you for the quick response. So just to be sure that you know what I’m talking about…. here’s the link to the screenshot. https://dl.dropboxusercontent.com/u/5826806/screenshot1.jpg

    After seeing it… can you confirm that what you provided me in code will work for what I’m needing to accomplish?
    Will this same code work for all other slider captions (more than one)? If so how do I differentiate the code to use on other slider captions?
    That is… If I have more than one slider with captions and want to enlarge the caption and text differently for each, who do I accomplish this?
    Thanks

    #283145

    Hi!

    Yes, the code Ismael provided will make the changes you have shown in your screenshot. If you would like to apply the code differently on same of your pages, you can add page ID in front of the code as following

    .page-id-8128 .caption_framed .slideshow_caption .avia-caption-content {
    background: rgba(0,0,0,.8);
    font-size: 20px !important;
    color: red;
    }

    You can right click on Chrome or Firefox to inspect elements to find page ID’s http://i.imgur.com/HyPTCRg.jpg

    Cheers!
    Yigit

    #283201

    Yigit, Thank you!

    Finally we’re getting somewhere. Couple things though.

    1. It seems when the text is larger it automatically makes a paragraph (two lines). I want to be able to keep each separate caption on one line. Here’s what it does currently: https://dl.dropboxusercontent.com/u/5826806/screenshot1.jpg
    This is what I’m trying to do…
    “Your Safety… Is Our Business”
    “We take the pressure off…so you can focus on your business”
    2. How do I create more separation (space) between the two captions? Currently they’re almost touching and I’d like to get a little more gap there.

    Thanks for your help!!
    Joe

    #283251

    Hi!

    Please add following code to Quick CSS as well
    1-

    .slideshow_caption { width: 70%; }

    2-

    .caption_framed .slideshow_caption .avia-caption-content { margin-top: 10px; }

    Best regards,
    Yigit

    #283302

    Hi Ygit,

    Almost got it!
    I added the code as two separate lines and this is what I got: https://dl.dropboxusercontent.com/u/5826806/screenshot1.jpg

    Now I have the second caption shaded area with excess background. Do we need to code this separate the two?

    If I can fix this…I think that’s got it!

    Thanks
    Joe

    #283306

    Hey Joe!

    Try adding this code too:

    .avia-caption-content {
        display: inherit !important;
    }
    

    Result:

    Cheers! 
    Josue

    #283322

    Josue,

    Thanks that’s what I got too…great!
    But now it closed the gap back up that we just fixed using this code: ( .caption_framed .slideshow_caption .avia-caption-content { margin-top: 10px; } ).

    How do I get this back? … We’re sooo close.

    #283324

    Replace that code for this:

    .avia-caption-title {
        margin-bottom: 10px !important;
    }

    Regards,
    Josue

    #283326

    AWESOME !

    Thanks a lot guy’s.

    #283339

    You are welcome, always glad to help :)

    Regards,
    Josue

Viewing 15 posts - 1 through 15 (of 15 total)
  • The topic ‘“Caption” styling??’ is closed to new replies.