Support » Theme: Virtue » Image Captions always Left Aligned

  • I run two websites that use Virtue theme. Recently, image captions on both sites changed from centered to left-aligned. (it might be images and captions both, but it’s the captions that are obvious) I can force the captions to align with css, but then we can’t choose to right-align in cases where that would look better.
    I disabled all plugins and it didn’t help. When I switched to theme 2022, even with all plugins active, the captions aligned to center. Activating Virtue-child again moves captions back to the left. Both generic Image block and Kadence Advanced Image Block have this same alignment problem. I’ve searched my few tiny custom code files and css file for anything affecting alignment, and found no suspects.
    Thank you,
    Kathy

    The page I need help with: [log in to see the link]

Viewing 7 replies - 1 through 7 (of 7 total)
  • Hey, thanks for reaching out and apologies for the delay in response.

    What kind of changes have you made to your child theme? Have you tried testing the captions when you activate Virtue Parent theme?

    If you haven’t tried that, please do and let us know if the same thing happens.

    Thanks,
    Kevin

    Thread Starter kengholm

    (@kengholm)

    Thanks for getting back to me on this.
    – Captions are left-aligned even when using Virtue Parent theme.
    – Custom functions are limited to unsetting a bunch of Woo fields in the Checkout form.
    – CSS is minimal, mostly stuff for specific items and locations. I can’t find anything that should affect alignment of captions on Posts and Archives such as here: https://www.haitiapgrandi.org/category/agronomy/

    There is this, which ended up centering all captions in the main content area of the home page, but not on other pages:
    /*Center captions for Our Key Iniatives on Home page*/
    .homecontent .wp-block-columns figcaption {
    text-align: center;
    }

    Here is the entire css file below in case you want to see it:
    ……………………………………………………….

    /*Improve spacing for Headers and Paragraphs*/
    h2 {
    	margin: 4px, 0, 20px;
    }
    
    /*Center captions for Our Key Iniatives on Home page*/
    .homecontent .wp-block-columns figcaption {
    	text-align: center;
    }
    
    /*Set font size for text at bottom of page (about our charity) */
    .footercredits p {
    	font-size: 14px;
    	text-align: left;
    }
    
    /*Set font and alignment for the sidebar link to our Privacy Policy page */
    .privacy {
    	font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
    	text-align: left;
    }
    
    /*Set font for post titles in Latest Posts block*/
    .wp-block-latest-posts li > a {
    	font-size: 36px;
    	line-height: 36px;
    	font-weight: 700;
    	margin-top: 1em;
    	margin-bottom: 4px;
    		/*text-decoration: underline;*/
    }
    
    /*Set font sizes and boldness for drop-down sub-menu items. Main menu items are styled
    * in the Theme Options panel.*/
    #nav-main ul li .sf-dropdown-menu li a {
    	font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
    	font-size: 14px;
    	font-weight: 600;
    }
    
    /*Style web links*/
    #content a:link {
      text-decoration: underline;
    }
    
    #content a:visited {
      text-decoration: underline;
    }
    
    #content a:hover {
      text-decoration: underline;
    }
    
    #content a:active {
      text-decoration: underline;
    }
    
    /*Style the Category Filters*/
    .hapg-category-filter .cat-item,
    .hapg-category-filter .cat-item-all {
        display: list-item;
        list-style-type: square;
    }
    
    /*Adjust positioning of the Donate buttons so they are horizontally centered and not too
    * close to items above or below. */
    .loan-button {
    	margin-bottom: 5rem;
    }
    
    /*Tidy up how the PayPal Donate button is displayed*/
    div.donate-button {
    	position: relative;
    	padding-bottom: 4rem;
    	padding-top: 1rem;
    }
    div.donate-button form {
    	margin: 0;
    	position: absolute;
    	left: 50%;
        margin-right: -50%;
    	transform: translate(-50%, -50%);
    }
    
    div.donate-loan {
    	position: relative 
    }
    div.donate-loan form {
    	margin: 0;
    	position: absolute;
    	margin-top: 3rem;
    	left: 50%;
        margin-right: -50%;
    	transform: translate(-50%, -50%);
    }
    hannah

    (@hannahritner)

    Hi @kengholm,
    Try changing your css to this:

    figcaption {
        text-align: center;
    }

    Does that work as you’re wanting?

    Kindly,
    Hannah

    Thread Starter kengholm

    (@kengholm)

    Hello Hannah,
    Forcing all captions to center is not a solution for us. The standard WP Image Block has a control for selecting left, center, or right alignment. My clients for their website and I for my website want this control to work so we can choose the appropriate alignment for captions depending on a page or post’s design.
    When I switch to a different theme (2022), the alignment control for the Image Block works properly. It is only when I revert to Virtue or Virtue-Child that the captions (and probably the images themselves) are forced to the left. Virtue-child has no php or css to affect images or captions on pages other than Home.
    Thank you,
    Kathy

    hannah

    (@hannahritner)

    Hey Kathy,
    Thanks you for the detail. I’ll forward this to the developer and see if he has any insight.
    Thanks for your patience!

    Kindly,
    Hannah

    Hey,
    you can add this css:

    .wp-block-image .aligncenter {
        text-align: center;
    }

    That would make it so only when you align the image center do the captions also align center.

    Ben

    Thread Starter kengholm

    (@kengholm)

    Thank you, Ben! That looks like a good patch for now. I’ll try it soon and probably do similar for .alignright, etc.
    I still hope that in the future, the Virtue theme stops aligning captions to the left.
    Kathy

Viewing 7 replies - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.