السلام عليكم ورحمه الله وبركاته والصلاه والسلام على رسول الله الكريم محمد (صلى الله عليه وسلم)مرحبا بكم زوار مدونة عالم التسويق الشبكى<لدي اليوم أضافة مهمة جدا لمدونات البلوجر وهو نموذج جميل ورائعة خاص بالأشتراك بالقائمة البريدية للمدونات البلوجر بحيث يكون زوار مدونتك على أتصال دائما ومعرفة جديد اخبار ومواضيع المدونةBeautiful model and wonderful special partnership mailing list for Blogs
الأختلاف في هذه الأضافة عن الأضافات السابقة التي طرحتها في المدونة أنها على شكل ظرف الرسائل وبأستخدام أكوادHTML5يحيث تعطي شكل قوي وجميل وأحترافي للمدونة البلوجر
وهذه صورة للشكل الأضافة
قبل أن أشرح طريقة تركيبها في مدونات البلوجر
هذا موضوع خاص بهذه الأضافة والتي تم طرحها سابقا في المدونة والتي تتميز بالأحترافية
هاك أشتراك بالقائمة البريد بشكل أحترافي لمدونات البلوجر
طريقة التركيب
- توجه للوحة التحكم الخاصة بمدونتك
- تصميم
- أضافة أداة
- أختار منها أداة (HTML / جافا سكريبت)
- وأضف الكود التالي بداخل الصندوق
- working, from home,work at home
<div id="content"><h1> للحصول على جديد أخبار ومواضيع المدونة </h1><form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=msms0.blogspot', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input type="hidden" value="msms0.blogspot" name="uri" />
<p> <label for="usermail" class="iconic mail-alt"> عنوان البريد الألكتروني : </label> <input type="email" name="email" id="usermail" placeholder="أضف بريدك الألكتروني هنا" required="required" /> </p><input type="submit" value=" أشتراك !" /></form></div><style>/** Created And Converted For Blogger By - msms0.blogspot.com **/
#container {width:465px; margin:20px auto 0;}a, a:visited {color:#fff; text-decoration:none; font-size:13px;}a:hover {text-decoration:underline;}h1 {font-family: 'Questrial', Verdana, sans-serif;text-align:center;font-size:25px;padding:0;margin:0 0 20px 0;position:relative;color:#8C8C8C;}/** have a nice ampersand **/h1:after {font-size:25px;color:#D6CFCB;content: '&';text-align:center;display:block;width:100%;font-family: 'Alice', Verdana, serif;text-shadow: 0px 1px 0px #fff;}/** create the gradient bottom **/h1:before {position:absolute;bottom:15px;content: ' ';text-align:center;display:block;height:2px;width:100%;background: -moz-linear-gradient(right, rgba(255,255,255,0) 0%, rgba(182,180,180,0.7) 42%, rgba(180,178,178,0) 43%, rgba(168,166,166,0) 50%, rgba(180,178,178,0) 57%, rgba(182,180,180,0.7) 58%, rgba(238,237,237,0.3) 90%, rgba(255,255,255,0) 100%); /* FF3.6+ */background: -webkit-gradient(linear, right top, left top, color-stop(0%,rgba(255,255,255,0)), color-stop(42%,rgba(182,180,180,0.7)), color-stop(43%,rgba(180,178,178,0)), color-stop(50%,rgba(168,166,166,0)), color-stop(57%,rgba(180,178,178,0)), color-stop(58%,rgba(182,180,180,0.7)), color-stop(90%,rgba(238,237,237,0.3)), color-stop(100%,rgba(255,255,255,0))); /* Chrome,Safari4+ */background: -webkit-linear-gradient(right, rgba(255,255,255,0) 0%,rgba(182,180,180,0.7) 42%,rgba(180,178,178,0) 43%,rgba(168,166,166,0) 50%,rgba(180,178,178,0) 57%,rgba(182,180,180,0.7) 58%,rgba(238,237,237,0.3) 90%,rgba(255,255,255,0) 100%); /* Chrome10+,Safari5.1+ */background: -o-linear-gradient(right, rgba(255,255,255,0) 0%,rgba(182,180,180,0.7) 42%,rgba(180,178,178,0) 43%,rgba(168,166,166,0) 50%,rgba(180,178,178,0) 57%,rgba(182,180,180,0.7) 58%,rgba(238,237,237,0.3) 90%,rgba(255,255,255,0) 100%); /* Opera 11.10+ */background: -ms-linear-gradient(right, rgba(255,255,255,0) 0%,rgba(182,180,180,0.7) 42%,rgba(180,178,178,0) 43%,rgba(168,166,166,0) 50%,rgba(180,178,178,0) 57%,rgba(182,180,180,0.7) 58%,rgba(238,237,237,0.3) 90%,rgba(255,255,255,0) 100%); /* IE10+ */background: linear-gradient(right, rgba(255,255,255,0) 0%,rgba(182,180,180,0.7) 42%,rgba(180,178,178,0) 43%,rgba(168,166,166,0) 50%,rgba(180,178,178,0) 57%,rgba(182,180,180,0.7) 58%,rgba(238,237,237,0.3) 90%,rgba(255,255,255,0) 100%); /* W3C */}/* Here comes to good stuff : content styling */#content{position:relative;width:400px;min-height:200px;z-index:100;padding:30px;border:1px solid #383838;/* My stipped background */background: #D1D1D1; /* Old browsers */background: -moz-repeating-linear-gradient(-45deg, #EFC1CB , #EFC1CB 30px, #F2F2F2 30px, #F2F2F2 40px, #C2E8F5 40px, #C2E8F5 70px,#F2F2F2 70px, #F2F2F2 80px); /* FF3.6+ */background: -webkit-repeating-linear-gradient(-45deg, #EFC1CB , #EFC1CB 30px, #F2F2F2 30px, #F2F2F2 40px, #C2E8F5 40px, #C2E8F5 70px,#F2F2F2 70px, #F2F2F2 80px); /* FF3.6+ */background: -o-repeating-linear-gradient(-45deg, #EFC1CB , #EFC1CB 30px, #F2F2F2 30px, #F2F2F2 40px, #C2E8F5 40px, #C2E8F5 70px,#F2F2F2 70px, #F2F2F2 80px); /* FF3.6+ */background: repeating-linear-gradient(-45deg, #EFC1CB , #EFC1CB 30px, #F2F2F2 30px, #F2F2F2 40px, #C2E8F5 40px, #C2E8F5 70px,#F2F2F2 70px, #F2F2F2 80px); /* FF3.6+ *//*border-radius*/-webkit-border-radius:8px;-moz-border-radius:8px;border-radius:8px;/*box-shadow*/-webkit-box-shadow:0px 1px 6px #3F3F3F;-moz-box-shadow:0px 1px 6px #3F3F3F;box-shadow:0px 1px 6px #3F3F3F;}/** my "fake" background that will hover the stripes **/#content:after{background:#F9F9F9;margin:10px;position: absolute;content : " ";bottom: 0;right: 0;left: 0;top: 0;z-index: -1;border:1px #E5E5E5 solid;/*border-radius*/-webkit-border-radius:8px;-moz-border-radius:8px;border-radius:8px;}/*** form styling **//** we remove the red glow around required fields since we are already using the red star */input:required, textarea:required {-moz-box-shadow:none;-webkit-box-shadow:none;-o-box-shadow:none;box-shadow:none;}/** inputs and textarea**/input:not([type="submit"]), textarea{outline:none;display:block;width:380px;padding:4px 8px;border:1px dashed #DBDBDB;color:#3F3F3F;font-family:'Droid Sans',Tahoma,Arial,Verdana sans-serif;font-size:15px;/*border-radius*/-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;/*transition*/-webkit-transition:background 0.2s linear,box-shadow 0.6s linear;-moz-transition:background 0.2s linear,box-shadow 0.6s linear;-o-transition:background 0.2s linear,box-shadow 0.6s linear;transition:background 0.2s linear,box-shadow 0.6s linear;}input:not([type="submit"]):active,textarea:active,input:not([type="submit"]):focus,textarea:focus{background:#F7F7F7;border:dashed 1px #969696;/*box-shadow*/-webkit-box-shadow:2px 2px 7px #E8E8E8 inset;-moz-box-shadow:2px 2px 7px #E8E8E8 inset;box-shadow:2px 2px 7px #E8E8E8 inset;}input:not([type="submit"]){height: 20px;}/* placeholder */::-webkit-input-placeholder {color:#BABABA;font-style:italic;}input:-moz-placeholder,textarea:-moz-placeholder{color:#BABABA;font-style:italic;}textarea{min-height:150px;resize:vertical}label{color:#7F7E7E;-webkit-transition: color 1s ease;-moz-transition: color 1s ease;transition: color 1s ease;}label:hover{color:#191919;}label:before{color:#C1BFBD;-webkit-transition: color 1s ease;-moz-transition: color 1s ease;transition: color 1s ease;}label:hover:before{color:#969696;-webkit-transition: color 1s ease;-moz-transition: color 1s ease;transition: color 1s ease;}p{margin-bottom:20px;}.indication{color:#878787;font-size:13px;font-style:italic;text-align:left;padding-left:10px;}.required{color:#E5224C;}/** Styling the send button **/input[type=submit]{margin-right:235px;cursor:pointer;background:none;border:none;font-family: 'Alice',serif;color:#767676;font-size:29px;padding:10px 4px;border:1px solid #E0E0E0;text-shadow: 0px 1px 1px #E8E8E8;background: rgb(247,247,247);background: -moz-linear-gradient(top, rgba(247,247,247,1) 1%, rgba(242,242,242,1) 100%);background: -webkit-gradient(linear, right top, right bottom, color-stop(1%,rgba(247,247,247,1)), color-stop(100%,rgba(242,242,242,1)));background: -webkit-linear-gradient(top, rgba(247,247,247,1) 1%,rgba(242,242,242,1) 100%);background: -o-linear-gradient(top, rgba(247,247,247,1) 1%,rgba(242,242,242,1) 100%);background: -ms-linear-gradient(top, rgba(247,247,247,1) 1%,rgba(242,242,242,1) 100%);background: linear-gradient(top, rgba(247,247,247,1) 1%,rgba(242,242,242,1) 100%);/*border-radius*/-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;/*box-shadow*/-webkit-box-shadow:0px 1px 1px #FFF inset,0 0 0px 5px #EAEAEA;-moz-box-shadow:0px 1px 1px #FFF inset,0 0 0px 5px #EAEAEA;box-shadow:0px 1px 1px #FFF inset,0 0 0px 5px #EAEAEA;/*transition*/-webkit-transition:all 0.2s linear;-moz-transition:all 0.2s linear;-o-transition:all 0.2s linear;transition:all 0.2s linear;}input[type=submit]:hover{color:#686868;border-color: #CECECE;background: rgb(244,244,244);background: -moz-linear-gradient(top, rgba(244,244,244,1) 0%, rgba(242,242,242,1) 100%);background: -webkit-gradient(linear, right top, right bottom, color-stop(0%,rgba(244,244,244,1)), color-stop(100%,rgba(242,242,242,1)));background: -webkit-linear-gradient(top, rgba(244,244,244,1) 0%,rgba(242,242,242,1) 100%);background: -o-linear-gradient(top, rgba(244,244,244,1) 0%,rgba(242,242,242,1) 100%);background: -ms-linear-gradient(top, rgba(244,244,244,1) 0%,rgba(242,242,242,1) 100%);background: linear-gradient(top, rgba(244,244,244,1) 0%,rgba(242,242,242,1) 100%);/*box-shadow*/-webkit-box-shadow:0px 1px 1px #FFF inset,0 0 0px 5px #E0E0E0;-moz-box-shadow:0px 1px 1px #FFF inset,0 0 0px 5px #E0E0E0;box-shadow:0px 1px 1px #FFF inset,0 0 0px 5px #E0E0E0;}input[type=submit]:active,input[type=submit]:focus{position:relative;top:1px;color:#515151;background: rgb(234,234,234);background: -moz-linear-gradient(top, rgba(234,234,234,1) 0%, rgba(242,242,242,1) 100%);background: -webkit-gradient(linear, right top, right bottom, color-stop(0%,rgba(234,234,234,1)), color-stop(100%,rgba(242,242,242,1)));background: -webkit-linear-gradient(top, rgba(234,234,234,1) 0%,rgba(242,242,242,1) 100%);background: -o-linear-gradient(top, rgba(234,234,234,1) 0%,rgba(242,242,242,1) 100%);background: -ms-linear-gradient(top, rgba(234,234,234,1) 0%,rgba(242,242,242,1) 100%);background: linear-gradient(top, rgba(234,234,234,1) 0%,rgba(242,242,242,1) 100%);/*box-shadow*/-webkit-box-shadow:0px -1px 1px #FFF inset,0 0 0px 5px #E0E0E0;-moz-box-shadow:0px -1px 1px #FFF inset,0 0 0px 5px #E0E0E0;box-shadow:0px -1px 1px #FFF inset,0 0 0px 5px #E0E0E0;}</style>
مدونه متخصصه ,تعرض كل ما يهم الباحث عن الربح ،والعمل من المنزل, تركز على مواقع الربح والتسويق وتقنياتها ، تسعى الى تحسين الربح واحترافه وتمتد الى الشبكات الاجتماعيه ومواد اخرى لانجاح مواقع الربح'
ولأن فقط أستبدلmsms0.blogspot المشار له بالكود برابط خلاصتك في feedburner
يمكنك تغيير العبارات وذلك من خلال البحث عنها في الكود
وأعمل حفظ للأداة وضعها في المكان المناسب لقالب المدونة
وسلام عليكم ورحمة الله وبركاته
عالم التسويق الشبكى