Change Capton size

Home Forums Easy FancyBox Pro Change Capton size

This topic contains 1 reply, has 2 voices, and was last updated by  RavanH 1 year, 5 months ago.

  • Author
    Posts
  • #6669

    Oliver Heuft
    Participant

    Hi there,

    I have two questions:
    1) Can I change the size of the Caption-text? Its kind of small 😉

    2) Can you help me with opening a gallery by clicking a single image on the page? I don’t want to have all of the images displayed on the page…

    Best!

  • #6670

    RavanH
    Keymaster

    Hi Oliver, welcome on these forums and thank you for your purchase 🙂

    1. The size of the caption (title) text will normally depend on your theme”s style rules that apply to the BODY tag. You can target the title text in FancyBox with a rule like:

    
    #fancybox-title {
        font-size: 1.2em;
    }
    

    (or use “16px” for example)

    You can add this style rule to your theme’s stylesheet or you can add this style by installing Jetpack and activating the Custom CSS module. This gives you a new admin page Aopearance > Edit CSS where you can paste this rule.

    2. There are many different ways to do this but it depends on your particular case which is the easiest. Do you have more than one gallery on your site and you want this to to apply to all of them or only some? Do you have many images or just a few?

    Here are the basic steps of the most common method :

    A. Open your post/page for editing in the Text tab and insert the first image thumbnail in your post content (set “link to media file”!) to serve as the gallery thumbnail.

    B. Place the following code to start a hidden div containing all the other images that should only be visible in FancyBox:

    
    <div class="fancybox-hidden">
    

    C. Right after that starting on a new line, insert all other images you want to show in your gallery. You can even use the WordPress internal gallery feature with the shortcode [gallery link="file"] or you can insert them one by one.

    D. Close the hidden div with the following code on a new line:

    
    </div>
    

    Hope that hepls 🙂

You must be logged in to reply to this topic.

Site by Pharéo | Hosted on The Permanently Moving Network