This could be done simply in CSS… just add the background-image property to the class of your single post container. For example if your posts are wrapped in <div class="single-post"> then you’d do something like this in your CSS:
.single-post {
background-image: url("path to image");
}
I dont see any of that. This is all that is contained in my style.css file
/*
Theme Name: BuildaWPsite Theme
Theme URI: http://www.BuildaWPsite.com
Version: 1.3.1
Description: A customizable theme with a simple yet robust set of theme options.
Author: BuildaWPsite Theme
Author URI: http://www.BuildaWPsite.com
Copyright: (c) 2014 BuildaWPsite.com
License: GNU General Public License v2.0
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: fl-automator
*/
/*
WARNING! DO NOT EDIT THEME FILES IF YOU PLAN ON UPDATING!
Theme files will be overwritten and your changes will be lost
when updating. Instead, add custom code in the admin under
Appearance > Theme Settings > Code or create a child theme.
*/
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
If you’re not using a Child Theme, and if the theme doesn’t have a designated section of the dashboard for CSS modifications then do the following:
- Install this Custom CSS Manager plugin http://wordpress.org/plugins/custom-css-manager-plugin
- use its “CSS Code” section of the dashboard to hold your CSS modifications:
-
(put this code in)
.single-post {
background-image: url("path to image");
}
- Save
Alternatively use your Child Theme style.css file to hold your CSS modifications
Andrew, that worked. But the image I am looking to change is the image directly behind the single post. The content area that is hard to read found here for example: http://alightthroughthedarkness.com/personal-details-of-thousands-of-lloyds-customers-feared-stolen-after-data-storage-device-goes-missing/
Do you have a code that will either remove it or give me the ability to add a colored transparent backing to it? my posts are hard to read right now.
Let me mention that I only want to make these changes for the Single post page only.
If I’m understanding correctly based on the example you posted, the problem is the page background underneath the post… as I see it there are two options… one would be to eliminate the background image, the other would be to modify the transparency on the post background so the page background doesn’t show through as much. In either case if you only want the change to impact single posts you would need to modify the single post template (single.php) and add styling to override the main styling. I’m sorry to say I’m not familiar with the plugin mentioned in Andrew’s post above so I can’t speak as to how to do it with that plugin.
Thank you guys so much for your help. Someone gave me a code that worked perfectly. Here is the code in case anyone ever needs it:
.fl-content.fl-content-left.col-md-9 {
background-color: black;
background: rgba(0,0,0,0.7) !important;
}
Thanks again guys. This stuff is definitely over my head but everyone has been so helpful and patient.
