[3J]

Hi I want to display 9 header highlight images, but no matter what number I set the “No of Header Highlight Content” to, there are only spaces for 5 images. Our test website is at http://www.midsouthcon.website

Thanks in advance.

[Mahesh]

@3j: There has been a small bug in the theme which is now resolved and will be available in the next update. But if you do want to fix the bug right now, edit inc/customizer-includes/clean-magazine-customizer-header-highlight.php file, go to line number 132 and change value of step from 2 to 1

Regards,
Mahesh

[3J]

Thanks that worked. I have another quick question: as you make the window smaller, the Header Highligh images jump from 4 across to 2 across to one across. Where can I change the bowers size at which they switch? I want the pictures to go a bit smaller before jumping to to two across, and for them to never go down to one across.

[Mahesh]

@3j: As far as I understood from the above reply, go to Dashboard=> Appearance=> Customize=> Theme Options=> Custom CSS box and add the following CSS:

@media screen and (max-width: 1024px) {
	#header-highlights-content .hentry {
		width: 25%;
	}
}

@media screen and (max-width: 540px) {
	#header-highlights-content .hentry {
		width: 50%;
	}
}

Regards,
Mahesh

[3J]

That did it. Thank you so much for the quick response – we made the right decision going with a catch theme for our site. One last question and then I’m done. How would I modify the size of the title of the header highlight images? I want to have them shrink down a bit when the images do, or if that is not possible, just make them a bit smaller to begin with.

Thanks again for all of your help.

[Mahesh]

@3j: Here, I’ve combined the above code and also adjusted the font-size as you’ve mentioned. Please replace previous code with this one.

@media screen and (max-width: 1024px) {
  #header-highlights-content .hentry {
    width: 25%;
  }
  #header-highlights-content .header-highlight-content-wrap .entry-title {
    font-size: 18px;
  }
}

@media screen and (max-width: 540px) {
  #header-highlights-content .hentry {
    width: 50%;
  }
  #header-highlights-content .header-highlight-content-wrap .entry-title {
    font-size: 12px;
  }
}

Note: Please adjust the font-size as desired.

Regards,
Mahesh

[Author]

Posts