chucktilbury's picture

Posted by chucktilbury on Fri, Dec 11, 2020 - 7:55pm

Hi everyone. I am still very new to backdrop and web site creation in general. I have been trying to change the color of text in different blocks. I know that someone may gasp at this.... I am experimenting a lot with things, as much to see what I can get away with as much as to get my site the way I want. I am using the Basis theme v1.17.4 and I moved the default header to the footer in an attempt to get the login links to the bottom of the page instead of the top. The login link turned red and is almost invisible against the green background.

My question is: Is there some secret sauce that will allow changing things like the background color of a "default" block? Or the color of the text? I grepped the CSS files until my fingers were blue, but I couldn't get the clue. (I don't know CSS and I am a slow learner <<grin>>)  I could not really figure out how to get the custom block to do something like switching the links based on whether the current user is logged in or not. I don't know what I don't know if you know what I mean. I am probably asking the wrong question, since I think it's likely that I am not the first one to want to do this.

The Basis theme is fine for what I want to do as far as the layout goes. I am mostly interested in figuring out how to change the colors and maybe the locations of things. I would like to have a footer block with things like "login" and some other links to different sites.

 

Comments

Fri, Dec 11, 2020 - 8:36pm by stpaultim

Here are a few possible thoughts that might help you. If you provide more information about your skill level (with css and working with themes), what you have tried, and the exact nature of what you are trying to do, we might be able to provide more help.

1) The best way to change the color of text and/or add a background color is probably to either create a sub-theme or possibly to copy the Basis theme from core into your themes directory and edit the css. But to do this, you will need some CSS knowledge as well as some knowledge about how themes works. 

2) If you know some CSS but don't want to edit core or contrib themes, you can use a module like the CSS Injector module. 
https://backdropcms.org/project/css_injector

You can use this module to add CSS rules through the user interface without touching the actual theme. But, again, it does require some CSS skills. 

3) I'm sorry that the Configurable Block Styles module did not work for you. There are a number of modules like this that might help with very specific problems. We'll try to get the Configurable Block Styles module fixed for you (I use it quite a bit and it has always worked for me, but I see your problem). 

I'm not sure how to change the colors of a block, other than through the above suggestions. 

I could not really figure out how to get the custom block to do something like switching the links based on whether the current user is logged in or not.

You should provide more information about what kinds of links you are talking about and what kind of change you want to make. 

The most obvious answer to this question would be to create two blocks, one that is only visible to unauthenticated users and one that is only visible to authenticated users. Then you can put whichever links you want for each group into the correct block

 

Rogelio's picture

Sun, Dec 13, 2020 - 4:37pm by Rogelio

hi you can change the background color in css, add the css color in basis/css/skin.css

.backgroundlightblue{
    background-color: #D6FEFE;
}

then in the block style settings add "backgroundlightblue"

with the text would be the same but, the link color has higher priority than text color, if you change the text color it will have no effect, the simplest way to change it is in Basis - general settings

indigoxela's picture

Mon, Dec 14, 2020 - 12:21am by indigoxela

you can change the background color in css, add the css color in basis/css/skin.css

@Rogelio That means "hacking core themes", which is not recommended. The next core update would break that again.

The css_injector module handles this in a cleaner way, changes won't get lost on updates.

Is there some secret sauce that will allow changing things like the background color of a "default" block?

Have you already tried the Block Background module?

I don't think that there's a module that changes text color for specific blocks. But you can change the overall text color in Basis with the Color (core) module.

If that module's enabled go to admin/appearance/settings/basis.

Mon, Dec 14, 2020 - 2:53pm by stpaultim

> I don't think that there's a module that changes text color for specific blocks. But you can change the overall text color in Basis with the Color (core) module.

Actually, the Configurable Block Style module allows a user to change the background color and/or the text color for any specific block. 
https://backdropcms.org/project/configurable_block_style

Also, we just fixed the bug that @ recently reported and @hosef put out a new release. 

Here are some screenshots:
https://github.com/backdrop-contrib/configurable_block_style/wiki