Need to update CSS for Shapely Parallax Section for FrontPage

Shapely
1

Hi! I need up do the following CSS updates for different instances of the Parallax Section for FrontPage widget. I have not changed any of these CSS settings yet and they are still the defaults from installation.

Can I customize each instance of the Parallax widget or is any change a global change?

Change the size of the body copy.
Change the color of the body copy.
Change the text alignment of the body copy (from center to left aligned, for background full, background small, top, and bottom aligned image selections).
Change the width or alignment of the text within the text space that the current centering occupies (for background full, background small, top, and bottom aligned image selections).
Change the background color for the sections that are alternating with the white background sections.

2

Hi There,

Thanks for reaching out to us.

In order for to be able to have a closer look at your setup and provide more specific advise,

Please use this plugin to create temporary access for us, its automatic login link and does not requires sharing your admin details. here is How To guide. at the and don’t forget about  “Set as private reply” at the bottom of the message box 

Hope to hear from you soon.

3

Hi,
I have set you up.
http://6ef.b25.myftpupload.com/wp-admin/?wtlwp_token=141b6ca1c48a08ab7cc23b291c6b33b6
Thank you.

4

Good morning Jim

Dear Jim everything is possible but this will require extensive customization of the theme, unfortunately, there are no built-in theme options to touch every element in such a detailed way to alter all its properties, in this case, you need to customize them, we can help you to customize several elements, i mean 2-3 question but what i see is a long list of the changes you want to made and this falls under customization territory, sorry and I hope you understand me

5

Hi Noda! Thank you for the response.

My goal is to use the theme with only CSS updates that can be accomplished in the Additional CSS editor. So I’ll work within the current structure.

Given that all changes are global, is it possible to let me know how to accomplish these Parallax Section for FrontPage alterations, and whether these changes will affect things globally:

Change the size of the body copy (for the web view, to make it a point or two larger. Mobile & tablet views are fine). Do you think it is better to just increase the % size or adjust the based font size?

Change the color of the body copy.

And lastly, change the background color for the widget sections that are alternating with the white background sections.

Thank you!

6

Good morning

“is it possible to let me know how to accomplish these Parallax Section for FrontPage alterations” - You can target any parallax section by the id of the section, they all have a unique id and you can catch them in developer tools of any browser

“Change the size of the body copy” - if you mean to change the size and color of the body text this is the CSS you need:

body {
line-height: 24px;
color: #404142;
}

“change the background color for the widget sections” - give me a URL of the page with the widgets (browsing your website but can’t find one :slight_smile: ) and i will help you with the code

7

Thanks Noda!

For “change the background color for the widget sections” - We’re still in staging with placeholder content. Look at the new home page: http://6ef.b25.myftpupload.com/

The sections that are headlined “Fair Warning” and “Haste Without Waste” and “Our trusted Salesforce and SAP integration providers.”

Also, on your comment “You can target any parallax section by the id of the section,” how would I target this Fair Warning section?:

<div class=“clearfix”></div>
</div><div id=“shapely_home_parallax-3” class=“widget shapely_home_parallax”> <section class=“bg-secondary”>
<div class=“container”>

					&lt;div class="row align-children"&gt;

						
						&lt;div class="col-md-4 col-sm-5 mb-xs-24"&gt;
							&lt;div class=""&gt;
								&lt;h3&gt;Fair Warning&lt;/h3&gt;&lt;div class="mb32"&gt;&lt;p&gt;								Quote-to-Cash has extraordinary potential, but realizing it depends on the right partner. As you’re navigating the Quote-to-Cash ecosystem, you’ll run into a lot of information that doesn’t add up. You don’t have time for that—and you definitely don’t have time for your vision to fail—so let’s focus on the facts.						&lt;/p&gt;

</div>“The Art of the Possible” VideoCustomer Satisfaction Stats </div>
</div>
<!–end of row–>

Thank you!

8

Good morning

“change the background color for the widget sections” - Sorry but this question stays still not clear for me, you want to change bg color of the widget section, where is the widgets on your homepage? :slight_smile:

You can use this code to target fair warning

#shapely_home_parallax-3 h3 {
font-size: 15px;
}

9

Hi Noda! Thanks again!

Attaching an image to point out the “change the background color for the widget sections” request.

Much appreciated!

-Jim

10

Good evening

Ok, now I get it, the screenshot is always better :slight_smile:
if you want to globally change that color use this code:

.bg-secondary {
background: #c1bfcc;
}

but if you want to change bg color only for that particular place use this code:

#shapely_home_parallax-3 .bg-secondary {
background: red !important;
}

11

Thanks so much Noda!

12

Thank you too :slight_smile:

I will close this case no, let me know if you have other questions in new ticket