editing css to fit modularity lite as a facebook page

• 

  mytholotees · Member · Jan 23, 2012 at 5:26 pm

  • Copy link
  • Add topic to favorites

  before i upgrade to custom css (which i expect i’ll need to do) can anyone confirm for me that i can edit the css for this blog to fit neatly in my facebook page? i do not want scroll bars on the side or bottom, just a lovely slideshow.

  many thanks for your help!

  lisa

  The blog I need help with is: (visible only to logged in users)

• 

  mytholotees · Member · Jan 23, 2012 at 5:27 pm

  • Copy link

  for reference:

  http://www.facebook.com/pages/Mytholotees/213669405337998?sk=app_316288351717257

• 

  designsimply · Member · Jan 23, 2012 at 5:49 pm

  • Copy link

  Well, one idea would be to make the entire site the width of the space given on that Facebook page, but I’m not sure that’d be ideal for visitors who go to the page direct.

  You can try out making the width smaller with this CSS using the preview button on your Appearance → Custom Design → CSS page:

  #top, .container, .container-inner, #slideshow .slide, #slideshow .slide img, #footer-wrap, #footer, .span-24, div.span-24 {
  width: 520px !important;
  }
  #slideshow .slide img {
  height: auto;
  max-width: 520px;
  }
  .content img.size-auto, .content img.size-full, .content img.size-large, .content img.size-medium, .wp-caption {
  max-width: 520px;
  }
  #footer-wrap { margin: 0 auto; }

• 

  thesacredpath · Member · Jan 23, 2012 at 5:55 pm

  • Copy link

  The slideshow cannot be narrowed. That is set in the underlying them PHP script files.

  Also the height of your site pages is determined by the content in them and facebook apparently has a fixed frame size so in most cases there will be vertical scrolling.

  This would be a lot of work (excluding the slideshow which cannot be changed) and I don’t think you would be that happy with it in the end.

• 

  thesacredpath · Member · Jan 23, 2012 at 5:58 pm

  • Copy link

  You might switch to the Manifest theme. The content area of that theme is only 500px wide so it would fit horizontally in the width of the frame. Then in a post on the main page, insert the wordpress slideshow (make it a sticky post so it sticks to the top of the page) and then create another post below it with the other images and such in it.

• 

  thesacredpath · Member · Jan 23, 2012 at 6:01 pm

  • Copy link

  I see what you did there. I didn’t dig deeply enough into the slideshow pile.

  Never mind what I said. @designsimply has you covered.

• 

  designsimply · Member · Jan 23, 2012 at 6:16 pm

  • Copy link

  I used slideshow trickery on that one. It works sometimes but not always!

  But, also, Manifest is a particularly good idea. @mytholotees, do check out Manifest. And maybe the slideshow shortcode too.

• 

  mytholotees · Member · Jan 23, 2012 at 6:21 pm

  • Copy link

  thanks to both of you for your suggestions. extremely helpful. i am *not* a css master by any stretch but will take some time this evening to give this a try.

• 

  designsimply · Member · Jan 23, 2012 at 6:46 pm

  • Copy link

  There’s lots to try! Dont get overwhelmed. :) Come back with specific examples if you get stuck or need more help.