Jump to content


Photo
- - - - -

How do you change the sidebar width on just the home page?


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

#1 highreach

highreach

    Advanced Member

  • Members

  • 79 posts

Posted 17 May 2012 - 06:09 PM

Hello, I have read several similar forum topics for a while, but have not found any solutions yet. So far I have been able to change the sidebar width on every page, but not on just one page. I want to make the right sidebar wider on just the home page. Any ideas on how to do this? Thanks a ton.

#2 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts

Posted 17 May 2012 - 07:09 PM

When you say you've been able to change the sidebar width on every page, do you mean individual pages with unique widths or globally?

#3 highreach

highreach

    Advanced Member

  • Members

  • 79 posts

Posted 18 May 2012 - 12:45 AM

I have been able to change it globally. If I get the homepage width I want, it changes on every page. I would like to change the sidebar width on the home page, but have it remain the same everywhere else.

#4 catrina

catrina

    Advocate

  • Members
  • 12345 posts

Posted 18 May 2012 - 02:26 AM

You can change the width in only the homepage by adding this to your Custom Code > Custom CSS:

Please Login or Register to see this Hidden Content


^ Change 500 to the pixel width you want.

#5 highreach

highreach

    Advanced Member

  • Members

  • 79 posts

Posted 19 May 2012 - 06:22 AM

Hey Catrina, Here is all the code that I have been using in Pagelines >Settings> Custom Code. I have not been able to get it to work yet. I am sure I am missing something. Any ideas? body{} #bp-adminbar-visitrandom-menu {display:none;} body.home div#sidebar2 div.scolumn {width: 500px;}

#6 catrina

catrina

    Advocate

  • Members
  • 12345 posts

Posted 19 May 2012 - 05:40 PM

Try this instead:

Please Login or Register to see this Hidden Content



#7 highreach

highreach

    Advanced Member

  • Members

  • 79 posts

Posted 04 June 2012 - 12:38 PM

still no luck :/ I put the code the "custom code" section of the pagelines settings tab, but it ended up cutting off the right side of all of the posts in the right hand column. Any other ideas?

#8 Jenny

Jenny

    Advocate

  • Unicorn Store Dev

  • 2924 posts

Posted 04 June 2012 - 08:58 PM

You will probably need to declare the width for the content section as well. Make sure you've downloaded

Please Login or Register to see this Hidden Content

and check out

Please Login or Register to see this Hidden Content

for more info. Also please be sure to watch our Firebug video tutorial

Please Login or Register to see this Hidden Content

.

#9 highreach

highreach

    Advanced Member

  • Members

  • 79 posts

Posted 19 June 2012 - 05:10 AM

Simple_mama, Thanks for the resources. Heres where I am at so far: body.home div#sidebar2 div.scolumn-pad {width: 500px;} p { border-style:solid; border-right-width:15px; } This keeps the cutoff content in the right sidebar and adds a thick black line to the right of each post excerpt. I think the first part " body.home div#sidebar2 div.scolumn-pad {width: 500px;}" is good because it seems to make the content extend further to the right. The next thing that needs to be figured out is how to make the left hand side of the right sidebar extend further to the left. I'll keep plugging away to see if I can come up with it. If anyone has any additional suggestions / resources / easier ways to do this, please send them my way.

#10 Danny

Danny

    Is Awesome!

  • Moderators
  • 17945 posts

Posted 19 June 2012 - 08:32 AM

Would it be possible to provide a screenshot or concept image of how you would like your homepage to look please.

#11 highreach

highreach

    Advanced Member

  • Members

  • 79 posts

Posted 20 June 2012 - 04:36 PM

Below is a screen shot of what my home page looks like. What I would like to do is take the right hand sidebar and make it wider. (Doing this will also make the content area smaller) I would like the make the right hand sidebar about 500 pixels wide so that it comes out somewhere around the word "China" in the post titled "Gutter Oil: Food Quality In China". Let me know if this description helps. If not, I can try another method of explanation. As always, Thanks a bunch for all of your help.
Posted Image

#12 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts

Posted 20 June 2012 - 07:33 PM

I believe this is a customization that's going to need a pro developer's attention. I'd suggest you seek out one of our Pros at

Please Login or Register to see this Hidden Content

and seek a quote for this. Unfortunately it's outside the scope of normal forum support. Alternatively, do you have any WP developers available? They may be able to help you with this.

#13 highreach

highreach

    Advanced Member

  • Members

  • 79 posts

Posted 21 June 2012 - 03:40 AM

Bummer. I'll post how I was able to change column widths once / if I am able to figure this out. Final questions: Jenny recommended I check out a website called w3 to learn how to code so I can change the column width on my pagelines site. Does anyone have any recommendations on what topics / area of website coding I should focus on to allow me to do this? So far I have been focusing on CSS, but have found it to be a very broad topic. Any additional recommended search terms would be really helpful. Also, do any of the developers know if the ability to change column width on a single page without the need to learn to code is coming to pagelines anytime soon? I am sorry for my ineptitude at figuring out this coding and truly appreciate the attempts to help me make the site we need. Cheers

#14 Danny

Danny

    Is Awesome!

  • Moderators
  • 17945 posts

Posted 21 June 2012 - 08:47 AM

Hi Highreach, I have compared your concept image and your websites homepage and they look the same or have I missed something ?

#15 highreach

highreach

    Advanced Member

  • Members

  • 79 posts

Posted 21 June 2012 - 03:08 PM

Nope, you didn't miss anything. The picture is what my homepage looks like. Above the image I had included a description of what I am trying to do, attempting to use "landmarks" (pagemarks?) on the page to give readers an idea of what I wanted to move where.

I would like the make the right hand sidebar about 500 pixels wide so that it comes out somewhere around the word "China" in the post titled "Gutter Oil: Food Quality In China".

Sorry for the lack of clarity. I have added some additional info to the pic below. Essentially, i want to make the right hand sidebar wider on the home page.
Posted Image

#16 Jenny

Jenny

    Advocate

  • Unicorn Store Dev

  • 2924 posts

Posted 21 June 2012 - 05:50 PM

Try adjusting these 2 values:

Please Login or Register to see this Hidden Content


And to make them specific to that page, you'll have to throw a

Please Login or Register to see this Hidden Content

in front. ;-)

#17 highreach

highreach

    Advanced Member

  • Members

  • 79 posts

Posted 02 August 2012 - 02:12 PM

Okay Pagelines. You win. simple_mama and the rest of the gang, I sincerely appreciate your help with this. I have run with these suggestions as far as I can. I simply can't get this to work. Assuming I have tapped all the resources available to do this myself, does anyone have a recommendation on how much this will cost to pay someone else to do? Thanks.

#18 catrina

catrina

    Advocate

  • Members
  • 12345 posts

Posted 02 August 2012 - 03:35 PM

Sorry this issue is such a pain. :( If you'd like to hire a Pro to assist you, please see here:

Please Login or Register to see this Hidden Content