v4.1.0

* Add alt and caption support to feature images

* Add feature image alt support to post card

* Remove three-curlies

assets/css/screen.css

@@ -1042,7 +1042,7 @@ except for when immediately preceeded by a heading */
 
 
 /* Captions */
-.kg-card figcaption {
+figcaption {
     padding: 1.5rem 1.5rem 0;
     text-align: center;
     color: rgba(0,0,0,0.5);
@@ -1050,9 +1050,12 @@ except for when immediately preceeded by a heading */
     font-size: 1.3rem;
     line-height: 1.4em;
 }
-.kg-card figcaption strong {
+figcaption strong {
     color: rgba(0,0,0,0.8);
 }
+figcaption a {
+    color: var(--ghost-accent-color);
+}
 
 
 /* Highly specific styles for traditional Instagram embeds */

author.hbs

@@ -31,13 +31,13 @@
                     <div class="author-profile-location">📍 {{location}}</div>
                     {{/if}}
                     {{#if website}}
-                    <span ></span><a class="author-profile-social-link" href="{{website}}" target="_blank" rel="noopener">{{website}}</a></span>
+                    <span><a class="author-profile-social-link" href="{{website}}" target="_blank" rel="noopener">{{website}}</a></span>
                     {{/if}}
                     {{#if twitter}}
-                    <span ></span><a class="author-profile-social-link" href="{{twitter_url}}" target="_blank" rel="noopener">{{twitter_url}}</a></span>
+                    <span><a class="author-profile-social-link" href="{{twitter_url}}" target="_blank" rel="noopener">{{twitter_url}}</a></span>
                     {{/if}}
                     {{#if facebook}}
-                    <span ></span><a class="author-profile-social-link" href="{{facebook_url}}" target="_blank" rel="noopener">{{facebook_url}}</a></span>
+                    <span><a class="author-profile-social-link" href="{{facebook_url}}" target="_blank" rel="noopener">{{facebook_url}}</a></span>
                     {{/if}}
                 </div>
 

package.json

@@ -2,7 +2,7 @@
     "name": "casper",
     "description": "A clean, minimal default theme for the Ghost publishing platform",
     "demo": "https://demo.ghost.io",
-    "version": "4.0.5",
+    "version": "4.1.0",
     "engines": {
         "ghost": ">=4.0.0",
         "ghost-api": "v4"

page.hbs

@@ -21,8 +21,11 @@ into the {body} tag of the default.hbs template --}}
                         {{img_url feature_image size="xl"}} 2000w"
                 sizes="(min-width: 1400px) 1400px, 92vw"
                 src="{{img_url feature_image size="xl"}}"
-                alt="{{title}}"
+                alt="{{#if feature_image_alt}}{{feature_image_alt}}{{else}}{{title}}{{/if}}"
             />
+            {{#if feature_image_caption}}
+                <figcaption>{{feature_image_caption}}</figcaption>
+            {{/if}}
         </figure>
         {{/if}}
     </header>

partials/post-card.hbs

@@ -14,7 +14,7 @@ which templates loop over to generate a list of posts. --}}
                     {{img_url feature_image size="xl"}} 2000w"
             sizes="(max-width: 1000px) 400px, 800px"
             src="{{img_url feature_image size="m"}}"
-            alt="{{title}}"
+            alt="{{#if feature_image_alt}}{{feature_image_alt}}{{else}}{{title}}{{/if}}"
             loading="lazy"
         />
     </a>

post.hbs

@@ -59,8 +59,11 @@ into the {body} tag of the default.hbs template --}}
                         {{img_url feature_image size="xl"}} 2000w"
                 sizes="(min-width: 1400px) 1400px, 92vw"
                 src="{{img_url feature_image size="xl"}}"
-                alt="{{title}}"
+                alt="{{#if feature_image_alt}}{{feature_image_alt}}{{else}}{{title}}{{/if}}"
             />
+            {{#if feature_image_caption}}
+                <figcaption>{{feature_image_caption}}</figcaption>
+            {{/if}}
         </figure>
         {{/if}}
     </header>

tag.hbs

@@ -7,7 +7,7 @@
         <div class="post-feed">
 
             {{#tag}}
-            <header class="post-card post-card-large">
+            <section class="post-card post-card-large">
                 {{#if feature_image}}
                 <div class="post-card-image-link">
                     {{!-- This is a responsive image, it loads different sizes depending on device
@@ -30,7 +30,7 @@
                             <div class="post-card-primary-tag">Tagged</div>
                             <h2 class="post-card-title">{{name}}</h2>
                         </header>
-                        <section class="post-card-excerpt">
+                        <div class="post-card-excerpt">
                             <p>
                                 {{#if description}}
                                 {{description}}
@@ -38,11 +38,11 @@
                                 A collection of {{plural ../pagination.total empty='zero posts' singular='% post' plural='% posts'}}
                                 {{/if}}
                             </p>
-                        </section>
+                        </div>
                     </div>
                 </div>{{!--/.post-card-content--}}
 
-            </header>
+            </section>
             {{/tag}}
 
             {{#foreach posts}}