Jump to content


Photo
- - - - -

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


  • Please log in to reply
8 replies to this topic

#1 aeruiz

aeruiz

    Member

  • Members

  • 13 posts
  • Framework Version:DMS
  • Country: Country Flag

Posted 16 February 2012 - 08:25 AM

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. ;-)

#2 Danny

Danny

    Is Awesome!

  • Moderators
  • 17622 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 16 February 2012 - 11:36 AM

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.

Please Login or Register to see this Hidden Content



Please Login or Register to see this Hidden Content



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.

Please Login or Register to see this Hidden Content



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:

Please Login or Register to see this Hidden Content



#3 aeruiz

aeruiz

    Member

  • Members

  • 13 posts
  • Framework Version:DMS
  • Country: Country Flag

Posted 16 February 2012 - 05:14 PM

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

#4 aeruiz

aeruiz

    Member

  • Members

  • 13 posts
  • Framework Version:DMS
  • Country: Country Flag

Posted 17 February 2012 - 01:03 AM

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,

Please Login or Register to see this Hidden Content

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.

#5 catrina

catrina

    Advocate

  • Members
  • 12345 posts
  • LocationCalifornia
  • Country: Country Flag

Posted 17 February 2012 - 05:05 AM

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?

#6 aeruiz

aeruiz

    Member

  • Members

  • 13 posts
  • Framework Version:DMS
  • Country: Country Flag

Posted 21 February 2012 - 06:01 AM

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

#7 Danny

Danny

    Is Awesome!

  • Moderators
  • 17622 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 21 February 2012 - 09:21 AM

Hi,

Please try the following code and see if this resolves your issue.

Please Login or Register to see this Hidden Content


I recommend you install either Firebug for FireFox or use Google Chrome's Web Developer tool, this will save you a lot of time.

#8 aeruiz

aeruiz

    Member

  • Members

  • 13 posts
  • Framework Version:DMS
  • Country: Country Flag

Posted 23 February 2012 - 09:24 PM

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 ;-)

#9 aeruiz

aeruiz

    Member

  • Members

  • 13 posts
  • Framework Version:DMS
  • Country: Country Flag

Posted 23 February 2012 - 11:55 PM

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!