Now trying variations on this, using Page ID and also regex …
function replace_subtitle($content) {
if( is_page(511) ){
$string = $content;
$pattern = '(<)(p)( )(class)(=)(")(subtitle)(")(>)(<)(\\/)(p)(>)';
$replacement = '<img src="protocol/domain/path/image.png" alt="text" />';
$content = preg_replace($pattern, $replacement, $string);
}
return $content;
}
add_filter('the_content', 'replace_subtitle');
-
This reply was modified 8 years, 5 months ago by
lukefive.
Hello there,
Using jQuery code will be a lot easier, I think. Try doing the below steps:
1. Install and activate the TC Custom JavaScript plugin
2. Go To Appearance > Custom JavaScript
3. Paste the following code into the provided box
jQuery(function($) {
if( $('.header-slider').length ){
var img = '<img src="http://yoursite.com/path/to/your/image.png" alt="Image alt text" style="display:block;margin:0 auto;" />';
$('.header-slider .slide-inner').append(img);
}
});
4. Update
Regards,
Kharis
Kharis that looked very promising. But we are having big image size problems. It wants to go full screen width. Here is what I have tried…
The jQuery:
jQuery(function($) {
if( $('.header-slider').length ){
var img = '<img src="/wp-content/uploads/2017/12/BCCI-Logo-150px-blackback2.png" style="display:block;width:150px !important;height:73px !important;margin:0 auto;" />';
$('.header-slider .slide-inner').append(img);
}
});
This CSS to our stylesheet…
div.slider img {
width:150px !important;
height:73px !important;
}
What we are actually seeing in the source…
<img src="/wp-content/uploads/2017/12/BCCI-Logo-150px-blackback2.png" style="display: block; width: 1503px; height: 731.46px; margin: 0px auto; backface-visibility: hidden; position: absolute; left: 0px; top: -112px; z-index: -1; max-width: none;">
We have lost too much time tinkering with this. Our client really wants their logo in the subtitle area. I may have to replace the Sydney splash page with static HTML that I can control/change.
Hello there,
Please try adding this extra custom CSS code:
.header-slider .slide-inner img {
width: 100px !important;
height: auto !important;
}
Regards,
Kharis
Kharis,
I should have time Thursday to try that.
Okay. Let me know how it works for you.
Regards,
Kharis
Last time I looked into this, I re-saved the functions.php file and now everything works fine. Apparently a problem with the cache. We need better diagnostic tools for WordPress.
Thanks Kharis for helping me.
You’re welcome!
Please let us know in a new topic if you have any further questions, or if we can provide you with any other assistance.
Regards,
Kharis
