1

I have a blogger site in which I use a custom theme.

I want to give the images which appear in my site homepage an alt and title attribute which I have originally given in the blog post but the theme sets the value of the image alt tag to the post title. For example in my blogpost I have the following image tag:

<img src="img.jpg" alt="img-alt" title="img-title">

but in the theme data the post image shown in the homepage for the post has these codes:

<img expr:src='data:post.featuredImage' expr:alt='data:post.title'>

I have tried to change it to:

expr:alt='data.post.featuredImage.alt'

but it gives no results so how can I access post specific data of tag attributes in blogger theme?

Lee Taylor
  • 7,761
  • 16
  • 33
  • 49
Entertainment Borg
  • 11
  • 1

1 Answers1

0

You cannot directly access the HTML attributes of the images in the post. Each object has limited and specific properties. You can see the properties of the "data.post.featuredImage" object at this website address: https://bloggercode-blogconnexion.blogspot.com/1971/06/data-posts-featuredImage.html

data.post.featuredImage

expr:alt='data.post.featuredImage.alt' // [alt] not exist; does not works

IDEA: Alternative (and expert) solution: Once the page is loaded, you can manipulate the images with Javascript. You can access the entire post content with the variable data:post.body. Add id and data-html attributes to the image:

<img expr:src='data:post.featuredImage' expr:id='&quot;myid-&quot;+data:post.id' expr:data-html='data:post.body' />

HTML code to be generated:

<img src='img.jpg' id='myid-321' data-html='<!-- post content -->' />

Loop all elements starting with myid-. Get the data-html attribute. Convert value to DOM element. Get alt attribute of first image in DOM. Assign this to the alt attribute of the image in the loop.

atakanau
  • 1
  • 3