Jump to content


Photo

Highlight


This topic has been archived. This means that you cannot reply to this topic.
22 replies to this topic

#1 bikeshopge

bikeshopge

    Advanced Member

  • Members
  • PipPipPip
  • 31 posts

Posted 28 October 2010 - 07:54 PM

Can I change just how this hightlight is shown on this page? I believe that I am to change the base .css but unsure how to go about this - http://thebikeshopge...sge/?page_id=44 #highlight .content-pad .highlight-area { padding-bottom:40px; padding-left:15px; padding-right:15px; padding-top:40px; #highlight .copy-pad .highlight-area { padding-bottom:20px; padding-left:15px; padding-right:15px; padding-top:20px;

#2 arpowers

arpowers

    Founder

  • Administrators
  • 3271 posts

Posted 28 October 2010 - 09:12 PM

yes, add some rules in base.css: `#highlight .content-pad .highlight-area{padding: XXpx}` Site is looking awesome btw!

#3 bikeshopge

bikeshopge

    Advanced Member

  • Members
  • PipPipPip
  • 31 posts

Posted 28 October 2010 - 10:33 PM

This is what I did and it didn't make the changes - I left everything in the base as it comes, and just added the lines that we talked about. What did I do wrong? Thanks on the site - your product is great!! /* ============================== */ /* = Start Your Custom CSS Here = */ /* ============================== */ /* @ CSS corresponding to the hook used in functions.php; adds a stumbleupon icon to branding section */ .icons .stumbleupon {background: url('../platformpro/images/sprite-socialicons.png') no-repeat -176px 0;} .icons .stumbleupon:hover {background: url('../platformpro/images/sprite-socialicons.png') no-repeat -176px -22px;} /* @ Pullquote Section */ #pullquote.copy{ background: #f7f7f7 url(images/pullquote.png) no-repeat 15px 15px; padding: 15px 20px 15px 45px; margin-bottom: 1.5em; } #pullquote .thepullquote{font-size: 1.5em;margin-bottom: 5px;line-height: 1.3em;} #pullquote .thecitation{color: #AAA; font-style: italic;padding-left: 15px;} #highlight .content-pad .highlight-area { padding-bottom:10px; padding-left:15px; padding-right:15px; padding-top:10px; } #highlight .highlight-splash { margin-bottom:0; margin-left:0; margin-right:0; margin-top:1em; }

#4 bryan-hadaway

bryan-hadaway

    Advocate

  • Members
  • PipPipPipPipPip
  • 3697 posts

Posted 29 October 2010 - 02:27 AM

` .page-id-44 #highlight .content-pad .highlight-area { padding-bottom:10px; padding-left:15px; padding-right:15px; padding-top:10px; } .page-id-44 #highlight .highlight-splash { margin-bottom:0; margin-left:0; margin-right:0; margin-top:1em; } ` You need to use `.page-id-44` to specify just that one page. Thanks, Bryan

#5 bikeshopge

bikeshopge

    Advanced Member

  • Members
  • PipPipPip
  • 31 posts

Posted 29 October 2010 - 02:38 AM

Okay thank you for that information - I made that change to reflect the page - here is the link http://thebikeshopge...bsge/services-2 However even with this code in place I am still not see the change in the page at all. .page-id-services-2 #highlight .content-pad .highlight-area { padding-bottom:10px; padding-left:15px; padding-right:15px; padding-top:10px; } .page-id-services-2 #highlight .highlight-splash { margin-bottom:0; margin-left:0; margin-right:0; margin-top:1em; }

#6 bryan-hadaway

bryan-hadaway

    Advocate

  • Members
  • PipPipPipPipPip
  • 3697 posts

Posted 29 October 2010 - 02:43 AM

Can you try placing the code in:

Theme Options > Custom Code > Custom CSS

instead of the Base theme and see if that works?

Thanks, Bryan

#7 bikeshopge

bikeshopge

    Advanced Member

  • Members
  • PipPipPip
  • 31 posts

Posted 29 October 2010 - 03:06 AM

Sorry 'No Joy' - I don't understand this seem very simple of a operation, but know matter what I change in the Base.css in the base child theme. Nothing happens - what am I missing or have forgotten to do??? Also I made this change to the file: /* ============================= */ /* = HOW TO CUSTOMIZE PLATFORM = */ /* ============================= */ /* Edit this style sheet to create your own custom theme based on the Base Platform theme. Rules placed in this stylesheet will override the default styles of the Base Platform theme and will not be changed or over written when you update the Platform framework. Additionally, since this stylesheet is purely for editing purposes you can easily undo or erase some of the CSS to return your site back to the look and feel of the Base theme. In the Base theme the footer is black ??“ the CSS looks like this: #footer { clear:both; font-size:1em; overflow:hidden; text-align: left; background: #000; color: #999; position: relative; } To change the background color to white, all you have to do is declare a new rule for the color like so: #footer { background: #FFF; } A great tool for modifying themes and inspecting CSS elements is the FireBug extension for FireFox. You can also use the developer tools provided by Chrome (right-click and "inspect element") or Internet Explorer if you're feeling dangerous. Also, for a comprehensive list of CSS rules and usage try consulting W3 schools @ http://www.w3schools...css/default.asp */ /* ============================== */ /* = Start Your Custom CSS Here = */ /* ============================== */ /* @ CSS corresponding to the hook used in functions.php; adds a stumbleupon icon to branding section */ .icons .stumbleupon {background: url('../platformpro/images/sprite-socialicons.png') no-repeat -176px 0;} .icons .stumbleupon:hover {background: url('../platformpro/images/sprite-socialicons.png') no-repeat -176px -22px;} /* @ Pullquote Section */ #pullquote.copy{ background: #f7f7f7 url(images/pullquote.png) no-repeat 15px 15px; padding: 15px 20px 15px 45px; margin-bottom: 1.5em; } #pullquote .thepullquote{font-size: 1.5em;margin-bottom: 5px;line-height: 1.3em;} #pullquote .thecitation{color: #AAA; font-style: italic;padding-left: 15px;} /* ============================================== Change to The BikeShpGlenEllyn Service Page - pading around the 'Service Page' highlight. ============================================== */ .page-id-services-2 #highlight .content-pad .highlight-area { padding-bottom:10px; padding-left:15px; padding-right:15px; padding-top:10px; } .page-id-services-2 #highlight .highlight-splash { margin-bottom:0; margin-left:0; margin-right:0; margin-top:1em; } Here is the page so you can see that there is no change - http://thebikeshopge...bsge/services-2 Thanks

#8 cmunns

cmunns

    Advocate

  • Members

  • 6537 posts

Posted 29 October 2010 - 07:37 PM

We are still sorting out how to organize the stylesheets so this mix up doesn't happen. But for now I recommend making a copy of pro.css and making your changes directly to that file or at the bottom of it.

#9 bikeshopge

bikeshopge

    Advanced Member

  • Members
  • PipPipPip
  • 31 posts

Posted 02 November 2010 - 06:28 PM

okay I am confused I though that was what the base was for. are you saying that I can't use the base at all?

#10 cmunns

cmunns

    Advocate

  • Members

  • 6537 posts

Posted 02 November 2010 - 09:59 PM

You can. This problem has been fixed and set for next update. FYI my recommendation was still utilizing base as any files that are named the same as they are in platform will take precedence. e.g. you can copy the template.postloop.php file into base and customize it and that will take precedence over the version that is in platform.

#11 bikeshopge

bikeshopge

    Advanced Member

  • Members
  • PipPipPip
  • 31 posts

Posted 03 November 2010 - 08:06 PM

Please I understand that I might be a little confused -- but I made the change that does work if I make the change directly to the page with fixbug on the site. So I know that the change that I need for a specific page will show correctly. If I can be directed on how or what I have done wrong...

#12 cmunns

cmunns

    Advocate

  • Members

  • 6537 posts

Posted 03 November 2010 - 11:36 PM

I don't understand your question. You haven't done anything wrong, you may just need to update platform. You shouldn't have to edit the file directly for the change, that's what I was trying to say.

#13 bikeshopge

bikeshopge

    Advanced Member

  • Members
  • PipPipPip
  • 31 posts

Posted 04 November 2010 - 01:39 PM

I never edited the file directly I used firebug to see what the changes would look like in the browser - this is a tool that your site / forum recommends... I then went to the child theme and updated the base file which is what I have read and what I did. However nothing that I have done - from what your documentation stated to do to what things that I have been told to do in the forum have done anything. Plus it has been 6 day's trying to get something simple - or at least I thought it should have been, and I am still no where closer to getting this resolved. I admit that I may have done a typo or missed something simple - that is why I included the whole file for review. Yet your response is less then helpful or answering what I need to do - one of your posts you reference a update coming soon - then in another post you mention that I need the upgrade??? Really 6 day's in a forum and I feel I am no closer to moving forward. I have other changes that I would like to do but I am very reluctant to even start them since this has taken so long...

#14 cmunns

cmunns

    Advocate

  • Members

  • 6537 posts

Posted 04 November 2010 - 06:07 PM

I understand. We were aware of issues with CSS not working and thus said the update would be coming. ...and we have in fact updated and that's what i was telling you to do. Keep this stuff in your css but update your Platform to 1.1.1 and it should work much better. You are currently on 1.1.0

#15 bikeshopge

bikeshopge

    Advanced Member

  • Members
  • PipPipPip
  • 31 posts

Posted 04 November 2010 - 10:24 PM

Went through the upgrade process and downloaded off your site the 1.1.2 and (I did backup everything first exported the setting and such so I could import everything in the updated site) uploaded the new platformpro which should say 1.1.2 but is says 1.1.1 - not sure why but it does. Then I imported all my settings from the XML file - that worked great. The checked that the base still had everything in it that I was hoping would change. Went to the page in question hoping that everything would be correct and the new setting would be there - but no still default settings. Here is the file again (base). /* ============================= */ /* = HOW TO CUSTOMIZE PLATFORM = */ /* ============================= */ /* Edit this style sheet to create your own custom theme based on the Base Platform theme. Rules placed in this stylesheet will override the default styles of the Base Platform theme and will not be changed or over written when you update the Platform framework. Additionally, since this stylesheet is purely for editing purposes you can easily undo or erase some of the CSS to return your site back to the look and feel of the Base theme. In the Base theme the footer is black ??“ the CSS looks like this: #footer { clear:both; font-size:1em; overflow:hidden; text-align: left; background: #000; color: #999; position: relative; } To change the background color to white, all you have to do is declare a new rule for the color like so: #footer { background: #FFF; } A great tool for modifying themes and inspecting CSS elements is the FireBug extension for FireFox. You can also use the developer tools provided by Chrome (right-click and "inspect element") or Internet Explorer if you're feeling dangerous. Also, for a comprehensive list of CSS rules and usage try consulting W3 schools @ http://www.w3schools...css/default.asp */ /* ============================== */ /* = Start Your Custom CSS Here = */ /* ============================== */ /* @ CSS corresponding to the hook used in functions.php; adds a stumbleupon icon to branding section */ .icons .stumbleupon {background: url('../platformpro/images/sprite-socialicons.png') no-repeat -176px 0;} .icons .stumbleupon:hover {background: url('../platformpro/images/sprite-socialicons.png') no-repeat -176px -22px;} /* @ Pullquote Section */ #pullquote.copy{ background: #f7f7f7 url(images/pullquote.png) no-repeat 15px 15px; padding: 15px 20px 15px 45px; margin-bottom: 1.5em; } #pullquote .thepullquote{font-size: 1.5em;margin-bottom: 5px;line-height: 1.3em;} #pullquote .thecitation{color: #AAA; font-style: italic;padding-left: 15px;} /* ============================================== Change to The BikeShpGlenEllyn Service Page - pading around the 'Service Page' highlight. ============================================== */ .page-id-services-2 #highlight .content-pad .highlight-area { padding-bottom:5px; padding-left:15px; padding-right:15px; padding-top:5px; } .page-id-services-2 #highlight .highlight-splash { margin-bottom:0; margin-left:0; margin-right:0; margin-top:1em; } Here is the site - http://thebikeshopge...bsge/services-2 and the page in question. I still am seriously UNCLEAR and why, or what I am doing wrong? Please is there a way that your team can <<<HELP ME>>>....

#16 bryan-hadaway

bryan-hadaway

    Advocate

  • Members
  • PipPipPipPipPip
  • 3697 posts

Posted 05 November 2010 - 03:32 AM

The problem is here: `.page-id-services-2` as far as I can tell this doesn't even exist? I told you a few replies back you need to use: `.page-id-44` So, all together: ` .page-id-44 #highlight .content-pad .highlight-area { padding-bottom:5px; padding-left:15px; padding-right:15px; padding-top:5px; } .page-id-44 #highlight .highlight-splash { margin-bottom:0; margin-left:0; margin-right:0; margin-top:1em; } ` Okay, confirm if that works or not and if it does we can all have a big phew :). Thanks, Bryan

#17 bikeshopge

bikeshopge

    Advanced Member

  • Members
  • PipPipPip
  • 31 posts

Posted 05 November 2010 - 02:11 PM

okay how do I state this - yes when we started this forum thread oh so many days ago the page in question was - http://thebikeshopge...sge/?page_id=44 that was before I changed to the following setting from the default setting under permalinks to numeric. Now the pages address is http://thebikeshopge...bsge/services-2 I did however try changing it back to .page-id-44 #highlight .highlight-splash as you described this still has no effect. I know the page was 'page_id=44' it is now 'services-2' because of the change that I had made in the permalinks settings so my logic was since the page is now called 'service-2' that is what I should direct the hook towards not a page naming convention that no is longer called 'page_id=44'? Now I have tried it both ways sent you everything that you have requested and made all the changes - please what am I doing wrong? I know each of you have a tremendous amount of time and code work in WordPress, and that I am not as versed in WordPress as you, but I am not without ability to read and follow procedures and steps that is outlined.

#18 cmunns

cmunns

    Advocate

  • Members

  • 6537 posts

Posted 05 November 2010 - 07:23 PM

Also, you currently don't have the Base child/customization theme activated. That is why your changes to base.css aren't working. Make sure that you activate Base, not just Platform and for the record. Every WordPress page will maintain a unique page id no matter what you change in the permalinks.

#19 bikeshopge

bikeshopge

    Advanced Member

  • Members
  • PipPipPip
  • 31 posts

Posted 05 November 2010 - 08:15 PM

Okay - i activate the base then am I using the base or PlatformPro? because now the PlatformPro is deactivated is this correct? What is being used PlatformPro 1.1.2 (which says 1.1.1) or Base 1.03? I just want to know what I am using / and if I do and upgrade to your next version 1.1.3 or such is that being used since the base is active and the PlatformPro is deactivated. What is WordPress using it seems a little counter intuitive at this point. Like I said I am new to the world of WordPress and its workings.

#20 cmunns

cmunns

    Advocate

  • Members

  • 6537 posts

Posted 05 November 2010 - 10:27 PM

don't worry this is confusing for everybody. Platform is basically a foundation (although it can be used on it's own) and Base goes on top of it. Think of a iphone case or something like that. So if you use Base and customize it, it will not change when you get a new iphone because you can still use it and keep your changes. If you made customizations directly to Platform they will be tossed out when you update. Does that make a little more sense? THey work together, but it's best to use Base for editing. Platform must be present in the theme folder for base to work.