- This topic has 14 replies, 3 voices, and was last updated 1 week, 4 days ago by Leo.
May 20, 2020 at 12:47 pm #1294363Linda
Can you please help me with 2 issues. You can see both issues on this page on our staging site: http://stage.mygoforthegreen.com/our-company/
1. How to add space between 2 lines in the initial heading/title under company name, “We optimize …”. I copied this 2 line heading from a Word document so there is a br tag putting title on 2 lines (that should be removed, correct?); if I remove br tag and make 2 separate headings, they are spaced way too far apart. So perhaps this question should be “reduce space between headings” instead???
2. How to reduce space between a heading and a bulleted list. This refers to all 3 bulleted lists. I’d like them to be closer to the headings which precede them.
I suspect this is a CSS issue, so am happy if you can link me to an explanation to save you time explaining it to me (although I always like your explanations)!
Thanks for your help once again,
LindaMay 20, 2020 at 7:29 pm #1294654LeoStaffCustomer SupportMay 21, 2020 at 1:09 pm #1295915Linda
Thanks, Leo. I’ll read over the CSS info you provided in your link to remind myself how to set up Custom CSS classes and where they go on the edit page.
I think the code you gave me goes in the Customizer under CSS. Think I also need to add a customer class in the edit page, too, under Additional CSS. Correct? Your link will probably help me with what to call it??
When you don’t get into this more technical stuff on a regular basis, it sure doesn’t stick!!
LindaMay 21, 2020 at 7:31 pm #1296116LeoStaffCustomer Support
The code we provide would be added using one of these methods:
CSS classes can be added in the sidebar if you are using the Gutenberg editor:
https://www.screencast.com/t/SGkYXcLOUfMay 22, 2020 at 6:50 am #1296628Linda
Oh, thanks so much for the clarification, Leo! 🙂 I was off on the wrong track.
I already have the Code Snippets plugin so will add your code to that to see what happens and let you know.
Hmm. I pasted your code into Code Snippets, New but got 2 Xs: Parse/syntax errors re. “}” in line 1 and unexpected “em” in line 2, wanted “;”. I could get rid of first error by changing } to :, but that didn’t fix the others. Realize I don’t really know what I’m doing here.
Tried to Google a way to fix this, but am coming up short. Can you tell what I’m doing wrong … please. I’ll keep searching and let you know if I can find a solution before you can get to this.
LindaMay 22, 2020 at 8:33 am #1296855DavidStaffCustomer Support
i think Leo accidentally posted the wrong article. That code is CSS – follow these instructions:May 22, 2020 at 8:51 am #1296880Linda
Hi David, thanks for the redirect. Sorry I wasn’t able to see the difference between PHP and CSS!! Duh. Will check out your link and let you know how it goes.
LindaMay 22, 2020 at 11:20 am #1297074Linda
Hi again, David,
Used the CSS plugin and it worked perfectly for the text on the page. Of course, I noticed it was a plugin created by Tom so no wonder it worked and was so simple to use! 🙂
!. Since I added it to the CSS box in Customizer while on the company page, does that mean it will apply only to that page? I hope.
2. Can you point me to where I can find CSS to reduce the space after headings and after some paragraphs?
Thanks for your help!And I hope you are staying safe and well during this virus discombobulation!!
LindaMay 22, 2020 at 11:29 am #1297080LeoStaffCustomer Support
1. If the CSS is in the customizer then it will apply to every page. If you need to code to apply to a specific page, then you will need to add it to the Simple CSS metabox in the edit page screen.
2. Which headings are you referring to here?
You will need to add a custom class to those “some paragraphs” so we can target them specifically.May 22, 2020 at 12:09 pm #1297132Linda
1. Yes, I figured it would apply to whole site in Customizer, but I had first looked on the edit page sidebar and could not find anywhere to put in the code. I thought it would go in an Additional CSS box. I’ve now found the metabox under the main part of the page and added it there – worked! Deleted it from Customizer first.
2. The 2 paragraphs I meant are the ones that have bulleted lists following a line of non-bolded text. Will the link you provided tell me how to do this? I hate to keep bugging you!!
Thanks for your help!
LindaMay 22, 2020 at 12:22 pm #1297148LeoStaffCustomer Support
Like these two here?
You’d need a custom class to those two paragraphs as I’ve shown in the screen capture here:
Then we can provide the CSS.
The class name can be whatever you want like
no-marginMay 22, 2020 at 1:01 pm #1297194Linda
Aha, got it. Yes, those were the correct two.
So I called the first CSS class
less-spaceand the second one
less-space-again. Or can I use the same class name for both since I’m doing the same thing (deleting space after) for both? If so, I’ll rename the second one the same.
Thank you SO much, Leo, for your detailed guidance!!
LindaMay 22, 2020 at 1:12 pm #1297212LeoStaffCustomer SupportMay 22, 2020 at 1:29 pm #1297226Linda
Perfect! I’ll play with this over the weekend and let you know how it all turns out. From your CSS I see I can reduce or increase the spacing by adjusting the em distance.
Will experiment with the first to see if the new spacing is the same as what I’m trying for in the second. If so, I’ll call it by the same class name as you suggested.
This has been wonderful learning, Leo. You’ve have really helped my understanding of CSS, class names and how to use both. I’ll enjoy trying it all out! 🙂
Again, many thanks, and back to you soon,
LindaMay 22, 2020 at 10:27 pm #1297510
- You must be logged in to reply to this topic.