• 0
Sign in to follow this  
Followers 0

ACCESS TO CSS FILES, BRAN-NAVIGATION Styling & POST-THUMBNAILS BORDERS

Question

Posted · Report post

Hello. I'm new here. I have a just a basic knowledge of css but not enough to figure out complex things without help. At first, I try to search for answers on the forum but is all confusing and unclear. Meaning I don't find the answers I am looking for. So, I will love your support with 3 things.... 1. ACCESS TO THE CSS FILES on my online WP site: I am using a LOCALHOST WP site for testing, and also I use another version ONLINE (on BLUEHOST), where I try to apply the changes I'm able to make and taste on the localhost site. This is my online site... www.rommelandanny.com/portfolio So, the problem I have is on the ONLINE site, where it seems that I don't have access to all the files like I do on my LocalHost. For example, when I go to the Dashboard, in Appereance -> Editor, I don't see these files... SECTIONS -> style.superfish.css, and others too that are contained in folders. Again, I am able to see and edit them on my localhost site using my text editor TextWrangler, but not on my ONLINE site using the Appereance Editor. So, I tried another thing, I went to the FILE MANAGER of my BLUEHOST Provider, and I was able to access to all the files through it, but when I made the changes, it did not really change anything on the site. So what do you think is the problem, and how can I solve it? 2. BRANDING NAVIGATION CSS Editing: My other problem is that I am having difficulties finding where is the specific css file where I could edit the style of the default HOVER of the BRANDING NAVIGATION. 2. BLOG POST THUMBNAILS BORDER: I will like to erase the borders of the Blog Post thumbnails. Where is the specific css file that deal with this styling? Which one is it? That's all for now. Thank you so much. ;-)

Share this post


Link to post
Share on other sites

8 answers to this question

  • 0

Posted · Report post

Hi Aeruiz, 1. If you want to add custom code, it is recommended you do not edit the core files. Instead you should either use the the Base child theme or the PageLines Customisation plug-in. http://www.pagelines.com/wiki/How_to_Use_the_Base_Theme http://www.pagelines.com/wiki/How_to_Use_the_PageLines_Customize_Plugin 2. To make your life so much easier, I recommend you install Firebug or FireFox or use the Google Chrome Web Developer inspection tool. This allows you to identify the CSS selectors so you can add your own styling. We also have a post which has basic styling for PageLines Framework navigation, this should assist you in styling your navigation. http://www.pagelines.com/forum/discussion/15956/pagelines-framework-2.0-css-tweaks.#Item_1 3. If you're using the PageLines Customisation plug-in add the below code to your style.css (in /plugins/pagelines-customisation/) or if you're using Base child theme, add the below code to Wordpress Admin Dashboard > PageLines > Settings > Custom Code > CSS Rules: [code].post-meta .c_img {background: transparent !important;box-shadow: none !important;border: none !important;}[/code]

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Danny, thank you. I will try your recommendations. ;-)

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi Danny, I followed your recommendations, and there was things that worked and other that didn't work. I read all the documentation about the base theme, the customize plugin and the css navigation tweaks codes, and followed the instructions. I reinstalled the original PageLine framework to keep the codes intact, and I activated the Base Theme to make my changes in there. I have always used firebug whenever I need it. This is WHAT WORKS.. If you take a look to my site, http://rommelandanny.com/portfolio/blog/ you'll notice that... 1. I was able to erase the post-thumbnails borders. 2. NAVIGATION: I was able to change just the PRIMARY NAV TEXT COLOR to black=> .main_nav li a { color: #000000; } using the WP Appareance => Editor, in both, my LocalHosted site and my BlueHosted site. BUT, this is WHAT DOESN'T WORK... 1. The background HOVER COLOR & TEXT COLOR .main-nav li a:hover, .main-nav .current-menu-ancestor .current_page_item a:hover, .main-nav li.current-menu-ancestor ul a:hover { background-color: #FFF; color: #FF0000; }... As you can see, the gray hover background is still there, and my intention is to erase it and have just a change on the PRIMARY NAV TEXT COLOR hover. Another thing is that, I added this code to change the NAVIGATION TOP PADDING ul.sf-menu li a{ padding: 50px 0 10px 25px; } And it just worked on the LocalHost site, but not on the online BlueHosted site.. Is there is any reason that is causing this to happen? Thank you for your support.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

The CSS may not be working because of a file permissions issue. Have you checked the online BlueHosted site files to see if they're set as writable?

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi Catrina, I checked into that and the files are set as writable. So, I guess is not a file permission issue.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi, Please try the following code and see if this resolves your issue. [code].main-nav li a:hover, .main-nav .current-page-ancestor .current_page_item a, .main-nav li.current-page-ancestor ul a:hover {color: magenta !important; background-color: transparent !important;} .main-nav li:hover, .main-nav .current-page-ancestor a, .main-nav li.current-page-ancestor ul a, .main-nav li.current_page_item a, .main-nav li.current-menu-item a, .sf-menu li li, .sf-menu li li li { background-color: transparent !important; }[/code] I recommend you install either Firebug for FireFox or use Google Chrome's Web Developer tool, this will save you a lot of time.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi Danny, thank you for this piece of information. I try this coding and it worked. Now I need to figure out how to change the top padding of the navigation. I have always used firebug, so it indicates that this is where I need to go.... ul.sf-menu li a { padding: 50px 0 10px 25px; }, I tried it and it just worked on my LocalHost site, but not on the online site. Any ideas? Thanks ;-)

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

OK, I found how to change the top Padding. Instead of editing the ul.sf-menu li a { } I edited the .main_nav li a { } Thank you!

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now
Sign in to follow this  
Followers 0