اضافة صفحة المعلومات ونبذه خاصة عن موقعك

السلام عليكم
اضافة صفحة المعلومات

انشر معلومات موقعك ونبذه خاصه عنك مع اضافة صورتك الشخصيه

اوشعار الموقع الخاص في قالب جميل مرفق بأزرار لمواقع التواصل

الاجتماعي تويتر وفيس بوك .

الكود

تستطيع اضافتها في اداة جاف سكربت وتضعها في اي مكان ترغب

<div id="infoPage"> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcrhu-VutSOgkET39oHVrQ55K5USroDpwS-KspUkE_KNos1VDw3IK-BRVkeVcItxxNEs1zOD2aDE_WFabh3e9NeogZtP1bYrr7kkP3YqylHR5m3cPyTIyK4PsntWBtu0ACQ1Fn-neshfxo/s1600/img.jpg" alt="Megtreb Alshnfre" width="150" height="150" /> <h1> Megtreb Alshnfre</h1> <h3> megtrb.blogspot.com</h3> <p class="description"> مدونة مغترب : مدونه عربيه شامله تهتم خصوصاً في اضافات ودروس مدونات البلوقر وتصميم وتعريب القوالب ومواضيع مختلفه اخرى<br /> <br /><span style="color:#FB8E08;font-size:18px;">Follow me on twitter or facebook.</span></p> <a href="http://www.facebook.com/login.php"target="_blank"><span class="button orange">Find me on Facebook</span></a> <a href="http://twitter.com/#%21/alshnfre"target="_blank"><span class="button orange">Follow me on Twitter</span></a> </div> <style> h1{ display: block; font-family: Arial, Helvetica, Sans-Serif; color:blue; text-align:center; font-size:42px; font-weight:normal; margin-bottom: 5px; padding-right:60px; padding-top: 15px; line-height:1; text-shadow:2px 2px 0 rgba(22,22,22,0.5); } h3{ display: block; font-family: Arial, Helvetica, Sans-Serif; color:#ff9900; text-align:center; font-size:18px; font-weight:normal; margin-bottom: 5px; padding-right:75px; padding-bottom: 5px; line-height:1; text-shadow:2px 2px 0 rgba(22,22,22,0.5); } #infoPage img{ display: block; float:left; margin-left:-90px; margin-top:20px; padding-left:10px; -moz-box-shadow: 2px 2px 0 #303030; -webkit-box-shadow: 2px 2px 0 #303030; box-shadow: 2px 2px 0 #303030; } #infoPage{ width:450px; background-color:#000000; margin:20px 50px 20px 50px; padding: 0 10px 20px 100px; border-bottom:1px solid #fff; } p.description{ font-family: Arial, Helvetica, Sans-Serif; color: #FFFFFF; font-size: 14px; font-weight: bold; text-align:center; display: block; float:right; width:330px; background-color:#413939; border:1px solid #fff; padding: 10px; text-shadow: 1px 1px 0 #333333; margin-bottom: 20px; -webkit-box-shadow: 2px 2px 0 rgba(22, 22, 22, 0.1); -moz-box-shadow: 2px 2px 0 rgba(22, 22, 22, 0.1); box-shadow: 2px 2px 0 rgba(22, 22, 22, 0.1); } .button { -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; -moz-box-shadow: inset 0 -1px 3px rgba(255,255,255,0.5), 0 2px 2px rgba(0,0,0,0.2); -webkit-box-shadow: inset 0 -1px 3px rgba(255,255,255,0.5), 0 2px 2px rgba(0,0,0,0.2); box-shadow: inset 0 -1px 3px rgba(255,255,255,0.5), 0 2px 2px rgba(0,0,0,0.2); border: 1px solid; padding: 8px 12px; margin-right:20px; color: #000; font-family: "Myriad Pro", Arial, Tahoma, sans-serif; font-size: 11px; font-weight: bold; text-shadow: -1px -1px rgba(0,0,0,0.1), 0 0 15px rgba(255,255,255,0.75); white-space: nowrap; background: #777; border-color: #777; text-decoration: none; font-style: normal; text-transform: none; position: relative; } .button:hover, .button:focus { bottom: 1px; -moz-box-shadow: inset 0 -1px 3px rgba(255,255,255,0.5), 0 3px 2px rgba(0,0,0,0.2); -webkit-box-shadow: inset 0 -1px 3px rgba(255,255,255,0.5), 0 3px 2px rgba(0,0,0,0.2); box-shadow: inset 0 -1px 3px rgba(255,255,255,0.5), 0 3px 2px rgba(0,0,0,0.2); background: #999; border-color: #999; /* Default color */ } .button:active { top: 1px; -moz-box-shadow: inset 0 -1px 3px rgba(255,255,255,0.5), 0 1px 2px rgba(0,0,0,0.2); -webkit-box-shadow: inset 0 -1px 3px rgba(255,255,255,0.5), 0 1px 2px rgba(0,0,0,0.2); box-shadow: inset 0 -1px 3px rgba(255,255,255,0.5), 0 1px 2px rgba(0,0,0,0.2); } .default { -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; } .blue { background: #166ba9; border-color: #166ba9; } .blue:hover, .blue:focus { background: #3390CF; border-color: #3390CF; } </style>


الى اللقاء ......ابو هشام  ؟العراق...الناصرية