A little hack for Social Fundraising Pages

Featured

Comments

2 comments

  • Avatar
    Zachary Twist

    Thank you Rich!.  This is very, very helpful.

    I used this to adjust my font size and line height as well as change the heading fonts and the links.

    Here is what I added to mine for a nice improvement.

    <style type="text/css">body {
    background-color: #004117;
    background-image: none;
    }

    .sfp-section-header {
    color: #88A139;
    font-family:serif;
    margin:15px 15px 10px;
    }

    p {
    margin:2px 10px;
    font-size: 13px;
    line-height: 16px;
    }

    /* unvisited link */
    a:link {
    color: green;
    font-size: 13px;
    line-height: 15px;
    }

    /* visited link */
    a:visited {
    color: green;
    font-size: 13px;
    line-height: 15px;
    }

    /* mouse over link */
    a:hover {
    color: blue;
    font-size: 13px;
    line-height: 15px;
    }

    /* selected link */
    a:active {
    color: red;
    font-size: 13px;
    line-height: 15px;
    }
    a.sfp-button.sfp-green.sfp-tall-button {
    font-size: 24px;
    color: white;
    }
    </style>

  • Avatar
    Jess Hoertel

    Totally recognize that this post is years old, but it is still a great hack since nothing has been done on the back end to make this easier to handle. HOWEVER, the changes do not follow through to the donation form itself, and the social fundraising form is a default simplified version, not the usual template. I tried making an alternate, but this changes the first page as well and I really do like how that that looks. It just really bothers me that as soon as they click donate, the original font, grey background, and green buttons come back. Any thoughts?

Please sign in to leave a comment.