Sign Up! Login: Password: New User? Forgot? Support
Top Mods!
Wowhead Search
by sonofsamedi
Digital Clock
by Wolfar15
Admin Forums
Welcome to the GuildPortal Help Community! These forums are for admin-to-admin help.
Available Forums
Forums : Pimp My Site! > Forum Quotes
Mottie (MVP) 11/25/2010 12:38 PM EST : Forum Quotes
GuildPortal MVP
Mottie
Posts: 3884
Zomgawsh Poster

Forum Quotes

Use the following CSS to add Forum Quotes around quote blocks, so they look like this:

Example 1
 

Example 2 (ignore the arrow icon, the image is from another site)


CSS
Add the following to your custom css (Control Panel > Custom HTML & Script > Custom CSS > CSS Additions to Standard tab).
  • Example 1 css:
    .MessageBodyCell1 .quoteTitle {
     background: #444;
     padding: 5px 80px;
    }
    .MessageBodyCell1 .quoteContainer {
     background: #222 url(http://i201.photobucket.com/albums/aa236/Mottie1/testsite/icons/quote-left.png) 2% 2% no-repeat;
     border: #444 1px solid;
     margin: 0;
    }
    .MessageBodyCell1 .quoteBody {
     background: transparent url(http://i201.photobucket.com/albums/aa236/Mottie1/testsite/icons/quote-right.png) no-repeat 98% 98% !important;
     padding: 5px 80px !important;
    }
  • Example 2 css:
    .MessageBodyCell1 .quoteTitle {
     padding: 10px;
     background: #000 url(http://www.axiomfiles.com/Files/278466/theme-quotes.png) right center no-repeat;
     border: #444 1px solid;
    }
    .MessageBodyCell1 .quoteContainer {
     background: #2a1011 !important;
     border: #444 1px solid;
     border-top-width: 0;
     margin: 0;
    }
    .MessageBodyCell1 .quoteBody {
     background: transparent url();
     padding: 20px !important;
    }
Customizing
  • Modify the color in blue to change the background and border colors. Do not change the "transparent" background color otherwise the second background image won't be seen.

  • If you have your own quote images, change the URL in orange. The left quote image should go into the ".quoteTitle" css and the right quote image will go into the ".quoteBody" css.

  • Adjust the padding (in red) in the title and body as needed to show the quote images, otherwise the text will overlap.
Update (11/26/2010): Correct the css and added example 2, since I inadvertantly mixed the css from the two examples together.
TopBottom

Merenwench (MVP) 11/25/2010 4:29 PM EST : RE: Forum Quotes
GuildPortal MVP
Merenwench
Posts: 2772
Zomgawsh Poster

Where does this code go?

TopBottom

Legend Light (Guild Admin) 11/25/2010 7:04 PM EST : RE: Forum Quotes
Legend Light
Posts: 179
Posts With Wolves

Merenwench said:
Where does this code go?

I was wondering the same thing and am afraid to take a guess and mess something up...
I cannot wait to use it, though!
TopBottom

Mottie (MVP) 11/25/2010 8:40 PM EST : RE: Forum Quotes
GuildPortal MVP
Mottie
Posts: 3884
Zomgawsh Poster

Sorry.. the post has been updated ;P
TopBottom

Legend Light (Guild Admin) 11/25/2010 9:00 PM EST : RE: Forum Quotes
Legend Light
Posts: 179
Posts With Wolves

Thanks, Mottie! 
TopBottom

Mottie (MVP) 11/26/2010 9:47 AM EST : RE: Forum Quotes
GuildPortal MVP
Mottie
Posts: 3884
Zomgawsh Poster

Hey folks!

Sorry I had to fix the css in the original post. I added example #2 since the css I had there originally was a mix of both examples.

Enjoy!
TopBottom

shadowvibe2000 (New Admin) 12/9/2010 4:07 PM EST : RE: Forum Quotes

shadowvibe2000
Posts: 20
Becoming Adept!

I new to guild portal and would like to be able to use this. I put the css into the CSS Additions to Standard, but i cant figure out how to get it to work in a forum post. Help!!!

Also will it work in news posts also?

Thanks
TopBottom

Mottie (MVP) 12/9/2010 4:20 PM EST : RE: Forum Quotes
GuildPortal MVP
Mottie
Posts: 3884
Zomgawsh Poster

Hi Shadowvibe2000!

When you add css to the css additions to standard tab, make sure the "enabled?" check box at the bottom is checked before clicking the save changes button. You won't see this is action until someone uses the quote post button. And I'm not sure that this will work in the news section because, if you click on the quote and reply button it adds BBCode like [QUOTETITLE] and [QUOTE] which I've never seen in the news section.
TopBottom

shadowvibe2000 (New Admin) 12/9/2010 4:26 PM EST : RE: Forum Quotes

shadowvibe2000
Posts: 20
Becoming Adept!

Awesome, thanks for your help, i got it to work. Not sure why it was not working. but it is now.

I'll have to see if i can find a way to do something like that in the news section.

Thanks again.

TopBottom

mgard73 (New Admin) 8/15/2011 12:59 AM EST : RE: Forum Quotes

mgard73
Posts: 7
Getting Started!

For some odd reason I cannot seem to get this to work on our guilds most recent webpage. Regardless of it being the only CSS present, it still does not seem to show up. Only the default content/widget background is present.

Here's an example image, the area in red is the quotation box:

TopBottom

Admins Online
There are   members online.
So-and-so has logged on!
%title%
%message%