SoundClick layout CSS help (with placing paypal button in css)

Discussion in 'HTML & Website Design' started by JoeCalibre, Mar 30, 2010.

  1. #1
    Hey guys well I produce music and I have a soundclick VIP page which is here (nvm last time I posted a link I got some kind of warning) and I am having major trouble understanding "CSS". I need to place an html PayPal button in my layout but im a total noob at this webdesigns stuff, I have tried just the code anywhere. Any CSS prodigy's out there willing to help?

    Heres a piece of what it looks like:



    /************* SoundClick CSS Template (based on 02 - Elegant Black) ******************/



    /* general */

    body {background:#333333 url(/bands/imagesBG/bg_grad_black_333333.png) repeat-x fixed; margin:0px;}

    body,div,tr,td,select,textarea,input,option {font-family:Verdana,Arial; font-size:12px;}

    a, a:link, a:visited {color:#ECECEC; text-decoration:none;}

    a:hover {color:red; text-decoration:underline;}

    .pageFooter {clear:both; color:gray; padding:30px 0px 50px 20px;}

    .infoBox {width:650px; margin:50px auto; border:silver solid 1px; padding:30px; font-size:14px;} /* hardly used, its for error messages to user */

    .infoBox .quotes {margin:20px; border:#cccccc dashed 1px; font-style:italic; padding:10px; background:#ECECEC;}

    /* for custom header, use like this: .customCSSHeader {display:block; background: url(LINK_TO_YOUR_IMAGE) center no-repeat; height: INSERT_HEIGHT_IN_PIXELS_HERE; } */

    .customCSSHeader {display:none;}



    /* main containers */

    .mainTable {background:#050505; color:#666666; border:black solid 1px; width:990px; margin:0px auto; text-align:left;}

    .mainContent {background:#050505; color:#999999; width:683px; float:left; overflow:hidden; margin:10px 0px 20px 5px;} /* IE6 doesnt support our preferred overflow:visible :( */

    /* not used for VIP accounts */

    .sideAd {width:300px; height:260px; margin:3px 2px 15px 10px; float:right; text-align:center; overflow:visible;}

    .sideAdSky {width:160px; height:610px; margin:3px 0px 15px 0px; float:right; text-align:center; overflow:visible; border-left:#999999 solid 1px;}



    /* left navigation */

    .navigation {background:#070707; width:300px; float:left; overflow:hidden; margin:10px 0px 20px 0px;}

    .navigation a:link, .navigation a:visited {color:#999999; text-decoration:none;}

    .navigation a:hover {color:white;}

    .navigationDivider {height:6px; line-height:6px; border-bottom:#232323 dashed 1px; margin-bottom:6px;}





    I need this paypal code in there so that it shows on my layout


    <form action="https://www.paypal.com/cgi-bin/webscr" method="post">
    <input type="hidden" name="cmd" value="_s-xclick">
    <input type="hidden" name="hosted_button_id" value="46B5N5QXLBK2J">
    <table>
    <tr><td><input type="hidden" name="on0" value="Buy Beats Below!">Buy Beats Below!</td></tr><tr><td><select name="os0">
    <option value="1 Lease">1 Lease $20.00</option>
    <option value="2 Leases">2 Leases $35.00</option>
    <option value="4 Leases">4 Leases $60.00</option>
    </select> </td></tr>
    <tr><td><input type="hidden" name="on1" value="Type Name of Beat">Type Name of Beat</td></tr><tr><td><input type="text" name="os1" maxlength="60"></td></tr>
    </table>
    <input type="hidden" name="currency_code" value="USD">
    <input type="image" src="https://www.paypal.com/en_US/i/btn/btn_buynowCC_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
    <img alt="" border="0" src="https://www.paypal.com/en_US/i/scr/pixel.gif" width="1" height="1">
    </form>


    Any help is much appreciated!
     
    JoeCalibre, Mar 30, 2010 IP
  2. designmonkey

    designmonkey Peon

    Messages:
    70
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    0
    #2
    CSS isn't the place to put your paypal code, the paypal code should go into the (X)HTML part of the page, if its template then it might goes to the code that generate the (X)HTML part ( i.e php ).

    I don't know soundclick, maybe you could get help from their contact support ( u're a VIP member, does that include support ? )
     
    designmonkey, Mar 30, 2010 IP
  3. JoeCalibre

    JoeCalibre Peon

    Messages:
    22
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    hmm makes tons of sense, all I see in my VIP control panel are "Advanced CSS".. ill have to look around for the html tab if there is one.

    Good lead tho, thank you ill keep posted as I make progress with this issue. There are several soundclick designers that charge to make you a layout but I want to learn how to catch the fish. Thanks again!
     
    JoeCalibre, Mar 30, 2010 IP
  4. JoeCalibre

    JoeCalibre Peon

    Messages:
    22
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    hey just letting everyone know that I solved my problem. Soundclick in a way is similar to myspace in the way of layouts & html. All you do is paste the html codes into the profile text boxes that are for artist questions. You will see what I mean of you compare the design on my page to other "stock" pages.
    That said, check it out

    www.RicanJoe.com
     
    JoeCalibre, Apr 1, 2010 IP
  5. MattChicago

    MattChicago Peon

    Messages:
    71
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #5
    yeah i got a couple music sites sorta like soundclick but a bit more advanced, it also has to deal with there allowed tags if you are trying to embed paypal buttons to your soundclick profile and what they allow for 'tags' for you all to use since some sites (my site included) has some tags disabled so people cannot add invading code to the profile page to try and hack a site or something.
     
    MattChicago, Apr 1, 2010 IP
  6. JoeCalibre

    JoeCalibre Peon

    Messages:
    22
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #6
    sounds awesome, whats the site? any links?
     
    JoeCalibre, Apr 1, 2010 IP