Implementing Code

  • While searching for plugins, I stumbled upon this: https://www.serradinho.com/Blog/thesis-tutorial-styling-of-note-alert-and-other-boxes-in-posts.htm

    That is a code to implement onto a Thesis theme, however, I don’t own or use Thesis. What is the WordPress equivalent to custom.css on thesis?

    If you go to that link and read what it’s about, then you’d know what I’m talking about.

    I want to add that code to a file so that when I’m posting, I can say [alert=Hello![/alert]

    And a box would appear saying (with an alert symbol next to it)

    Hello!

    The coding is below.

    <p class="note">This is an example of the alert box that will appear in my posts.</p>

.custom .format_text p.note {background: #E3F0F2 url(images/note.png) center no-repeat; border: 1px solid #66CCCC; background-position: 7px 50%; text-align: left; padding: 10px 10px 10px 45px; -moz-border-radius-bottomleft:4px; -moz-border-radius-bottomright:4px; -moz-border-radius-topleft:4px; -moz-border-radius-topright:4px; -webkit-border-top-left-radius:4px; -webkit-border-top-right-radius:4px; -webkit-border-bottom-left-radius:4px; -webkit-border-bottom-right-radius:4px;}
    <p class="alert">This is an example of the alert box that will appear in my posts.</p>

.custom .format_text p.alert {background: #ffffa0 url(images/alert.png) center no-repeat; border: 1px solid #E6DB55; background-position: 7px 50%; text-align: left; padding: 10px 10px 10px 45px; -moz-border-radius-bottomleft:4px; -moz-border-radius-bottomright:4px; -moz-border-radius-topleft:4px; -moz-border-radius-topright:4px; -webkit-border-top-left-radius:4px; -webkit-border-top-right-radius:4px; -webkit-border-bottom-left-radius:4px; -webkit-border-bottom-right-radius:4px;}

    Can anyone help me out with this?

Viewing 5 replies - 1 through 5 (of 5 total)

  • Read the blog post on how to use the code; a plugin called Wp-Note is also mentioned.

    The HTML goes in your post or page with the wordpress editor. The CSS goes in your styles.css in your theme; it doesn’t have to go in a file named custom.css.

    Thread Starter ryku650

    (@ryku650)

    Thank you very much! I have a few more questions.

    Won’t inserting the code in styles.css mess up anything?

    WP-Note isn’t mentioned in the post. If you are talking about another one, can you link me?

    The author that mentioned the code was talking about thesis styles, I am trying to use it for a regular wordpress style, can you check the code and see if there’s something wrong?

    All themes use CSS; editing CSS might cause conflicts, that’s why you need to learn some CSS in order to edit CSS.

    If you’re not comfortable editing CSS, try the plugin WP-Note.

    Thread Starter ryku650

    (@ryku650)

    I see.

    And wouldn’t you be able to tell me what to do? I’m fine if you can’t, I know many guys that can do this for me.

    WP-Note isn’t tested with my WordPress version. Thank you for the recommendation.

    Thread Starter ryku650

    (@ryku650)

    Bump.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Implementing Code’ is closed to new replies.

Tags