Backlight Custom CSS Issue

Splattered · 2016-06-14 02:37:39

Is there a trick to getting the custom CSS working other than enabling the "Custom Stylesheet" under the "Advanced Customization" tab on the backlight "Standard Page Template"? I am testing things out on my PC using the apache XAMPP process, but for whatever reason I can't get the custom css settings to work, including the "red background" that is already predefined in the included "custom-sample.css" file????

rod barbee · 2016-06-14 02:43:46

Activate and then choose the appropriate file. Save the template after you do.
Then make sure you're applying the page template to whatever pages, albums, or sets you're creating.

Splattered · 2016-06-14 02:52:11

Hi Rod - Thanks for the quick response.

I have enabled the advanced customization on the "Backlight Stand Page" template, which is applied to all of the pages, which I believe is already done by default. But just to make sure, I checked that it is applied to all of the Pages I am utilizing. So not sure what else I might be doing wrong since it appeared to be pretty simple according to the documentation and the blurb in the custom css file.

Do I have to enable the PHPlugins feature as well to make this work? I'm not a PHP guy, and am pretty familiar with CSS and linking CSS to HTML, so am really scratching my head on this one.

rod barbee · 2016-06-14 03:47:31

No, you don't have to enable phplugins.
When you view the page's source code in the browser can you see the custom css file being called? It's should be showing up right after the other style sheets and before any scripts, just before the </head> tag

Actually, I just looked at the current custom-sample.css file (the one included with Backlight 1.0.2) and it does not contain any code to turn text red!

open your local copy with a plain text editor and add this:

body, body * {
	color: #f00 !important;
}

then upload the custom-sample.css file to the /backlight/custom/css/ folder and see if your text turns red.

Splattered · 2016-06-14 05:11:01

After viewing the source code it appears to be calling the custom css correctly. After pasting your sample in the custom.css file the text in fact turned red as predicted. I think I must have had one of those senior moments and got confused by the top of the custom.css file that read...

/* If your page background-color is red after enabling the PHPlugins function, then you know it's working.
* Delete this after confirmation, because it's hideous :
*/

html,
body,
main {
background: linear-gradient(90deg, #ffffff 50%, #fafafa 50%, #fafafa);
}

And thought this was going to apply a red background for testing purposes. DOH!

rod barbee · 2016-06-14 05:24:43

that commented text is a leftover from the CE4 sample custom css file. In it, Matt had code that would turn the page background red.

That background gradient is hardly noticeable, especially if your normal page background is already white

Splattered · 2016-06-14 06:15:19

Thanks again for the help! Much Appreciated!

Community @ The Turning Gate

#1 2016-06-14 02:37:39

Backlight Custom CSS Issue

#2 2016-06-14 02:43:46

Re: Backlight Custom CSS Issue

#3 2016-06-14 02:52:11

Re: Backlight Custom CSS Issue

#4 2016-06-14 03:47:31

Re: Backlight Custom CSS Issue

#5 2016-06-14 05:11:01

Re: Backlight Custom CSS Issue

#6 2016-06-14 05:24:43

Re: Backlight Custom CSS Issue

#7 2016-06-14 06:15:19

Re: Backlight Custom CSS Issue

Board footer