Qq Mail List DIY meets the style of your website

Many webmasters put email subscription boxes on their blogs or other websites and use qq mail lists to subscribe to many boxes. This email subscription function is required on a customer website of Xiamen SEO,Xiamen SEOAfter installation, it is found that the subscription box style of the qq mail list is fixed, and the installation Code cannot be directly modified only by javascript. After carefully studying the code, we found that the subscription box called a js. After downloading this js, we found that the css of this subscription box was written in this js box. The comparison chart before and after modification is displayed.

Before modification:

After modification:

You can find that the modified style is more active and more suitable for the website style. The following Xiamen SEO will teach you how to modify it.

First of all, we need to send the call js download down: http://list.qq.com/zh_CN/htmledition/js/qf/page/qfcode.js next we modify this js, the modified Code is as follows:

If (typeof (nId )! = Null & typeof (sColor )! = Null & typeof (nWidth )! = Null & typeof (sText )! = Null)
{
Document. write (
[
"<Style> ",

". Dark {background: # aaa; border: 3px solid #666 ;}",
". MailInput {margin-top: 5px ;}",
". Rssbook. info {color: #666; font-size: 12px ;}",
". Light. Information {color: #666 ;}",
". Dark. info {color: # fff ;}",
". Rssbutton {float: left; border: 1px solid #698ab4;-moz-border-radius: 3px; border-radius: 3px;-webkit-border-radius: 3px ;}",
". Dark. rssbutton {border: 1px solid #585858 ;}",
". Rssbutton input {background: #77a0d1; border: 1px solid #88b3e6; color: # FFFFFF; cursor: pointer; font-weight: bold; width: 90px; display: block; height: 22px; line-height: 22px; * line-height: 19px; text-align: center ;}",
". Dark. rssbutton input {background: #676767; border: 1px solid #777 ;}",
". Rssbutton input: hover {background: # 86b4eb; text-decoration: none ;}",
". Dark. rssbutton input: hover {background: #797979; border: 1px solid #939393 ;}",
"Input. rsstxt {float: left; width: 140px; height: 20px; font-size: 14px; padding: 2px 3px;-moz-border-radius: 3px; border-radius: 3px; -webkit-border-radius: 3px; border: 1px solid # ccc; border-color: # 7c7c7c # c3c3c3 # c3c3c3 # 9a9a9a; margin-bottom: 5px ;}",
". Dark input. rsstxt {background: # eee ;}",
"</Style> ",
"<Div class = \" rssbook ", sColor,
"\" Style = \ "width:", nWidth, "\"> <p class = \ "info \"> ", sText," </p> ",
"<Div class = \" mailInput \ "> ",
"<Form action = \" http://list.qq.com/cgi-bin/pai_compose_send\ "target = '_ blank' method = 'post'> ",
"<Input type = \" hidden \ "name = \" t \ "value = \" __booked_feedback \ "> ",
"<Input type = \" hidden \ "name = \" id \ "value = \" ", nId," \ "> ",
"<Input id = \" to \ "name = \" to \ "type = \" text \ "class = \" rsstxt \ "value = \" \ "/>",
"<Div class = \" rssbutton \ "> <input type = \" submit \ "value = \" subscribe \ "> </div> ",
"</Form> ",
"</Div>"]. join ("");

}
Else
{
Alert ("nId empty ");
}

You can modify the style as needed and save the js. In the call code, change the full call of js to a local call of js code, which is the modified js Code. The modified code in the call code is as follows:

<! -The following is the QQ Mail List subscription embedded code-> <script> var nId = "website subscription code", nWidth = "100%", sColor = "light ", sText = "fill in your email address and subscribe to our wonderful content:"; </script> <script src = "your code. js "charset =" gb18030 "> </script>

Install the code to the location where you want to display the email subscription box. Here we have modified the code. To better suit the website theme style, you need to modify the style in js as needed, so that you can DIY an email subscription box that fits your website style.