إضافات بلوجر | إضافة للتعريف بتطبيق مدونتك للهواتف الذكية

لكي يكون تطبيقك مقدما بطريقة لائقة و جميلة في مدونتك تحتاج لتخصيص صفحة خاصة به في المدونة ، لكن لايكفي أن تكتب عنه فقط بل يلزمك عن تضع صورا له و كذلك أزرار تحمل روابط لتحميله .

معاينة الإضافة

لذا فاليوم سأقدم لك الكود الخاص بهاته الإضافة و كذلك المكان الأمثل لها ، أول ما وجب عليك فعله هو أن تنشئ صفحة جديدة في مدونتك عن طريق الولوج لقسم الصفحات في لوحة التحكم في بلوجر ، ثم الضغط على صفحة جديدة ، بعدها تضغط على HTML و تحذف الكود الموجود و تعوضه بهذا الكود 

<div dir="ltr" style="text-align: left;" trbidi="on"><style>/*-------------------- font --------------------*/ @font-face { font-family: "Ta3alamFont"; font-weight: normal; font-style: normal; src: url(https://dl.dropboxusercontent.com/s/l0mqm6g2vwflxp2/Ta3alamFont.eot); src: url(https://dl.dropboxusercontent.com/s/l0mqm6g2vwflxp2/Ta3alamFont.eot?#iefix) format('embedded-opentype'), url(https://dl.dropboxusercontent.com/s/gjkkuvnfze5ii1l/Ta3alamFont.woff) format('woff'), url(https://dl.dropboxusercontent.com/s/mjj8mvkq7jgihhn/Ta3alamFont.ttf) format('truetype'); } /*-------------------- #font# --------------------*/ *{ font-family:Ta3alamFont; } .ta3alamFans{ background: #FBF1FF; text-align: center; padding: 50px 0px 140px 0px; margin: -5px -27px -7px -26px; } .ta3alamFans img{ width:200px; } .appinfo{ width: 600px; height: 570px; background: #8D8D8D; margin: 40px auto; border-radius: 5px; box-shadow: 0px 0px 6px -2px #000; } .appimgdes{ width: 560px; margin: 0px auto; height: 180px; padding: 20px; border-bottom: 1px solid #868686; background: #302F2F; box-shadow: 0px -80px 160px -90px #000 inset; } .appimgdes img{ width: 160px; float: right; border: 5px solid #fff; border-radius: 30px; background: #3D1C56; } .appimgdes h3{ width: 340px; text-align: end; padding: 0px 20px; float: right; margin: 0px 0px 40px; font-size: 25px; font-weight: normal; color: #fff; } .choisedown{ width: 160px; height: 80px; float: left; background: #fff; border-radius: 8px 15px 15px 8px; padding: 0px; } .choisedown a{ float: right; padding: 0px; background: #C0C0C0; width: 80px; height: 80px; border-radius: 0px 8px 8px 0px; box-shadow: 0px 0px 100px 5px #1F1E1E inset; } .choisedown a:hover{ box-shadow: 0px 0px 80px 5px #1E1E1E inset; } .choisedown img{ width: 70px; border: none; float: left; padding: 5px; border-radius: 0; } .imageapp{ width: 600px; padding: 10px 0px; } .imageapp img{ width: 185px; margin: 0px 4px; border: 2px solid #000; border-radius: 4px; } </style> <div class="appinfo"> <div class="appimgdes"> <img src="https://lh4.ggpht.com/UI2T4ve7D6TcChI6Bb-2JoEJPEJ0ocuhSwmeJPaD7LAGKs1HWIhSRHVABvPlK3GsJZgv=w300-rw" /> <br /> <h3>المحترف</h3><br /> <div class="choisedown"> <a href="https://play.google.com/store/apps/details?id=com.th3professional.almohtarif"> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZMxmsKyAp3_h3A2Kw0FF42R7DCR5-AG9kHvjKH0ia908l_gIT8mOZnNW0TI-7FHoKMw87tJM88QiF8S4I_rSHzcb38DWsBkaQHlzPHj7ycYoF87idfhjrJZgAIKL5CMbBg55J0F0qH2k/s1600-r/downloading12.png" style="background: none; float: none; margin: 15px; padding: 0px; width: 45px;" /> </a> <img src="http://www.qrstuff.com/images/sample.png" style="background: #fff;" /> </div><a href="https://play.google.com/store/apps/details?id=com.th3professional.almohtarif"> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiF5Jqs3lFfQ98FTscuvAxLl8oXUzSBO2evXNzwSIjWp806uuF_KPFqtXUbiddTWy3uNHa9SYiaQCNmLaUbl4DKYR-iDAfX38e514Xq4qsDX8X_m1Swtv9yqIDvoXVKLutK6Ap5H8jyD3w/s1600-r/googleplay.png" style="background: none; border-radius: 5px; border: none;float: left; margin: 0px 20px; width: 170px;" /> </a> <br /> </div><div class="imageapp"> <img src="https://lh6.ggpht.com/m2nc7vQkbC7wO3DIr6M_4mlIS2zSy1mmmO0_OyO5kO8HH7qMa4pBnRWqNzEBH1Ko0VA=h310-rw" /> <img src="https://lh3.ggpht.com/oDG8qj9rGLKlYuPOMU8FhtexUkCD1MIUHaYWdXCiOBkeMFEvsin3NGtFnt7kc_wC18be=h900-rw" /> <img src="https://lh3.ggpht.com/Nu5_iMAL0_H734LSTnd3fKKjcU1nxXDsYim8XqGu9nQgvCWa9NzxpU3u8pDiW0YgvVw=h900-rw" /> </div></div></div>

ثم تقوم بتغيير روابط الصور و كذلك إسم التطبيق في الكود و تضغط على نشر .