RiverRat 4 Report post Posted October 14, 2013 Hi I am totally new to Pagelines and trying to figure a few things out. I am wondering how to do custom css. Specially use the styling classes box in the Edit box of a section or text box. Can you give me an example. I want to make the top right text in the header white and bold. If someone can give me directions on that I can customize the rest of the site as I do know CSS to some extent. http://buff.ly/GWcrIo Also does anyone know what I have to adjust? The left logo image has too much space on the bottom, but has 0 margin? same with navigation. I would like to tight this layout . Thanks Share this post Link to post Share on other sites
Danny+ 1,327 Report post Posted October 14, 2013 Hi, There is a docs page that covers how to use the style classes field which you can see here - http://docs.pagelines.com/tutorials/section-area-styling You should also check out our how to customize section - http://docs.pagelines.com/customize/how-to-customize I would also recommend checking out the free course over at Code School for Google Chromes web dev tools, after doing this awesome course, you should be a Chrome web dev tools ninja. https://www.codeschool.com/courses/discover-devtools Please search our forums, before posting! Share this post Link to post Share on other sites
RiverRat 4 Report post Posted October 16, 2013 Obviously I am missing something reading those articles. Specially use the styling classes box in the Edit box of a section or text box. ----- I want to make the top right text in the header white and bold. If someone can give me directions on that I can figure out how it works. http://buff.ly/GWcrIo There is also a space below the logo I can not get rid off to move the menu up. It looks like there is something around the image, but I can not find it? Share this post Link to post Share on other sites
Jake 74 Report post Posted October 16, 2013 Hi satinfeather99 - For your particular example, where you're looking to bold and change the color of that text box, you would first enter the following in the Custom Code section of the DMS visual editor: .myheader {font-weight: 800; color: #FFFFFF;} Then, in that particular textbox, in the Styling Classes section you'll add the following (WITHOUT the period (.) in front of it: myheader Publish those changes and you should be good to go! Have you searched the forums yet or checked out the DMS user docs?PageLines geek, blogging at MyUntangledLife.com Share this post Link to post Share on other sites
RiverRat 4 Report post Posted October 17, 2013 Perfect. Thank you Share this post Link to post Share on other sites
RiverRat 4 Report post Posted October 17, 2013 I need to tight the area below my logo and also below the menu. Do you know why I can't seem to do that using margin and padding or which specific area to lookin? http://buff.ly/199iKRR Thanks! Share this post Link to post Share on other sites
Danny+ 1,327 Report post Posted October 17, 2013 Hi, All sections come with some padding and margin, without it they would be to tight together and therefore, look rather odd. If you wish to remove margin/padding from a specific section, you will need to use custom CSS. Please bear in mind that we do not provide extensive custom CSS support, if you need CSS support you will most likely need to sign up to a CSS specific forum. You can also do the changes yourself, if you're unsure or not currently comfortable using CSS. I recommend you do the following: Read up on CSS, there are a number of awesome resources out there, such as: * W3Schools - http://www.w3schools.com/css/ * Codec Academy - http://www.codecademy.com/tracks/web * Code School - https://www.codeschool.com/ You should also use Google Chrome, when inspecting elements via the Web Dev tools, you can learn more and become a ninja with it in no time using the free code school course - https://www.codeschool.com/courses/discover-devtools Please search our forums, before posting! Share this post Link to post Share on other sites
RiverRat 4 Report post Posted October 19, 2013 Hello, I do know a fair amount of CSS it is your program I am getting to know as I have under very tight deadlines and going through a learning curve with this product which has put me behind in my projects by about a week. I see you help others with their problem instead of sending these emails to go read information which I have already read by the way, and it has not answered by questions. All I am asking for is a quick answer so I will know and apply it to other designs and make sense how to do everything else. I have already read you information but have questions....you posted this to help someone else which answers all my questions but my very important logo problem Is Awesome! Moderators 9527 posts @Mention LocationManchester, UK Country: Posted 15 October 2013 - 03:48 AM Hi, You will need to add the following code and also increase the width of your Branding image, as it is now no longer wide enough to fill the area. #site #branding .content-pad { padding: 0; } #site #feature { margin: 0; } What additionally I want to know is WHY there seems to be a space below my logo. I have tried everything to get rid of it. It is in a media box http://buff.ly/16iU7UK Shoot i don't even see how you post picture in this post and I have clicked everything. When switching over to a new product like this when designers are so busy right now, it would be nice to answer our questions instead of directing us to articles we have already read but do not answer our questions...very frustrating. So I see the answer you have posted before for someone else just learning the program. I just want to know how and where you get rid of the space below a media box or text box. If I can not answer this I can not continue with this theme because this is a big problem for me right now. Thanks so much http://buff.ly/16iU7UK Share this post Link to post Share on other sites
Rob 547 Report post Posted October 19, 2013 Try adding this to your custom code: #header .alignleft { float: left; margin: 0 1.5em 0 0; } #header .pl-area .pl-section .pl-section > .pl-section-pad { margin-bottom: 0; padding: 8px; } This should work. Former PageLines Moderator, Food Expert and Raconteur Share this post Link to post Share on other sites
RiverRat 4 Report post Posted October 19, 2013 Thank you so much!!! That did work and allows me to breath and get on with the rest of my sites and helps me to figure out how everything works....I do think that once I get through some minor growing pains with this program it will make designing Wordpress templates faster. Share this post Link to post Share on other sites
Rob 547 Report post Posted October 19, 2013 No worries. You'll find that Firebug for Firefox is a very helpful tool. http://www.getfirebug.com Former PageLines Moderator, Food Expert and Raconteur Share this post Link to post Share on other sites
RiverRat 4 Report post Posted October 19, 2013 I know unfortunately I have gotten an ad virus on the browser and it is in my system. Virus software not picking it up because it is in the system. Firefox is completely closed down. Only Chrome will work. Even if I delete and reinstall. So I have to reformat and I am installing Windows 8. Just need to catch up on these websites then it's a day doing computer maintenance. I do miss firefox and have to look into the tools Chrome has. Share this post Link to post Share on other sites
Rob 547 Report post Posted October 19, 2013 Try running this tonight http://housecall.trendmicro.com/ Former PageLines Moderator, Food Expert and Raconteur Share this post Link to post Share on other sites
RiverRat 4 Report post Posted October 19, 2013 Great! If that is a good one I will try it. I have not heard of that one? Thanks for the info! Share this post Link to post Share on other sites
Rob 547 Report post Posted October 19, 2013 You're very welcome. That one's free, and very comprehensive. It will find any serious problems. Former PageLines Moderator, Food Expert and Raconteur Share this post Link to post Share on other sites