Changing background colors of specific sections

Hello, is there a way to change the background color of each specific section so that it doesn’t look “document-white”?

Please see image to understand which parts I want to change the color of.

Hey there,

Please check the section settings; some allow for changing the background, while others do not.

Regards,

ok understood but that’s no good. I need to change everything the way I need them to be. I have understood that you can make these changes via wordpress (even if a theme won’t allow you to make the changes natively). Can you please provide a link that shows how to make these color changes via wordpress?
Thank you!

Hi @noun

My apologies for the inconvenience, but this is how it’s coded and created. Basically, when you edit the widget of the homepage, you will see if there is an option to change the background image.

In addition, I can assist you with custom CSS. If you provide the URL of the page and specify the section where you want to change the color, I will create custom CSS for you.

Regards,

1 Like

OH WOW!! Amazing that you can do this for me - because other than “hieroglyphics” I don’t understand what CSS is lol!

Not sure how you can add these CSS code-thingies to my site which I’m trying to build though… (I would have thought that you would need admin access - passwords etc - to edit anything), but if you can then SURE!! :slight_smile:

If you just need to “see” the site and the places that I need to edit/customize, so you can send me the CSS codes and I will then do it myself, I can of course PM you a screen recording and screenshots of the site I’m building on the Shapely theme, if you tell me how to PM you. :wink:

The site will EVENTUALLY be published on parties-et-cetera.gr, but for now I have just uploaded a temp landing page there so you will NOT see the Shapely theme there right now. I’ve just uploaded “anything” there so that there is “something” there for now until my site (made on Shapely) is ready to publish! :wink:

The Hostinger guys, where my site is hosted, have made a subdomain for me (on dev.parties-et-cetera.gr) so that I can build my site there (while the other temp theme is up on my real domain URL). They told me that when I finish making my site using Shapely, I will then replace the temp theme on my URL with the ready on from the dev. subdomain. I hope I’ve understood this correctly lol… But I dont think that you’ll be able to see anything on this subdomain URL unless you have my Hostinger etc passwords…

So, basically, what I need to be able to customize (via CSS, I take it is the only way…), is all the background colors of the blocks that are white by default - to black… In the 3 screenshots, the backgrounds on “Welcome”, “Limitless Options” and “How ya doin’…” (that was just me playing around lol - obv will not be posted…) are the ones I want to change. Basically, I don’t want white anywhere on my site - it reminds me of a Word document lol…



And then, I want to somehow make semi-transparent boxes behind the text in these areas (last 3 screenshots) so that the text is more readable since the background is very busy and you can’t read the text… :frowning: In the 1st screenshot (“Where human meets technology”) you will see an example of what I mean - this site was also made using Shapely…

*Though I have no idea how I could customize a CSS you can make for me to “tell” the box the position, size and shape I want it be. Nor how to select its color and opacity level so that it suits my site and taste… :frowning:



I’m really sorry to be asking all these questions but I have tried so hard to follow the videos etc in the Shapely documentation but it is just so confusing and difficult to follow if you have ZERO prior knowledge… :frowning: :frowning:

any update on the CSS code things you said you’d send me?

Hey there,

Im so sorry for the delay, what is the URL of the website?

Regards,

The site will EVENTUALLY be published on parties-et-cetera.gr, but for now I have just uploaded a temp landing page there so you will NOT see the Shapely theme there right now. I’ve just uploaded “anything” there so that there is “something” there for now until my site (made on Shapely) is ready to publish! :wink:

The Hostinger guys, where my site is hosted, have made a subdomain for me (on dev.parties-et-cetera.gr) so that I can build my site there (while the other temp theme is up on my real domain URL). They told me that when I finish making my site using Shapely, I will then replace the temp theme on my URL with the ready on from the dev. subdomain. I hope I’ve understood this correctly lol… But I dont think that you’ll be able to see anything on this subdomain URL unless you have my Hostinger etc passwords…

So, basically, what I need to be able to customize (via CSS, I take it is the only way…), is all the background colors of the blocks that are white by default - to black… In the 3 screenshots, the backgrounds on “Welcome”, “Limitless Options” and “How ya doin’…” (that was just me playing around lol - obv will not be posted…) are the ones I want to change. Basically, I don’t want white anywhere on my site - it reminds me of a Word document lol…

*II’ve included screenshots above :wink:

Hey there,

Thanks for the domain but its protected under the coming soon template, this will not allow me to see your website and hence I cant generate custom CSS for you, can you please unlock it?

Regards,

sure but I don’t know how to “unlock it” lol - can you tell me how?

*I thought that you would NEED to have my Hostinger password to be able to edit (so to apply the CSS codes etc), and in order to even see it… No?

But if you CAN edit it after I “unlock” it, wouldn’t that also mean that ANYONE who has the URL (eg people reading these posts – no offence, but you know what I mean).

I also just had a thought. Do you think it would be possible to create a PNG image (I can do this in affinity photo) with the white text in a semi transparent gray background, exported as a PNG, and then overlay it so that it acts exactly the same way as the parallax text that I’m talking about. So, essentially, replace the Parallex text of the theme, with an image that has a semi transparent background?

Hey there,

You just need to deactivate the coming soon plugin.

Not sure what exactly is your goal with .png images but you can try that :slight_smile:

Regards,

My goal for the png image is to be able to “quickly” create an image file that contains the text I want over a semitransparent shape (not necessarily a box like in the above that says “Where human meets technology”), and be able to pre-design the background shape in the color and opacity I want. When I’ve done that, then overlay this ready image with the semitransparent shape that I’ve made over the Shapely theme’s image. The point is to avoid all the CSS stuff which is, and likely to remain, incomprehensible to me. :stuck_out_tongue:

So, if overlaying the semitransparent image over the theme’s section is possible (and you would be able to see the section’s image of the Shapely theme, then I will achieve the same result that is seen in the aforementioned photo above, without needing to use all this CSS coding to do this.

If this would work, how would I go about placing this text-image over the section I want?

And would it work in the same parallaxing way when you scroll down the page (just as is shown in the Shapely demo page Front Page - Shapely Demo) where the background image stays stil,l text scrolls

For which URL/site should I deactivate the coming soon plugin? On the parties-et-cetera.gr site that is just an arbitrary and temporary theme? Or on the dev.parties-et-cetera.gr subdomain which is where I’m working on my site using Shapely theme?

I have deactivated the coming soon plugin so you can freely see the site I’m working on at dev.parties-et-cetera.gr

Can you please make the CSS code/s you said to set the semitransparent text background so that the text is more readable (but without hiding the background image/s? And please tell me how to apply it/them.

After these CSS things have been made, and I have applied them behind my text, will there be a way for me to change the shape size, color, and opacity level?

hi any news about the custom CSS you said you were going to make for me 16 days ago for dev.parties-et-cetera.gr? (I just want everything to be black – no white backgrounds anywhere :wink: )