Social Icon
السلام عليكم ورحمة الله وبركاته
اليوم سوف نتطرق لموضوع جميل قد يحتاجه الجميع و هو إضافة المواقع الإجتماعية الخاصة بالمدونة وصاحبها ومنا نرى من خلال الصورة الأولى هذه الآداة رائعة ذات صور جميلة وتأثير رائع ويمكنك تخصيصها كما تريد..
نتطرق للشرح..
![اذهب الى قالب ميني سوفت](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEhYhUsWUnrH-3RK5BE69FwsQJCIX9p7Q_IEgGiUq1Hod8-WF1ki6_1pW1BuHc36m8YFz_IoBFPl3xwz7GI70Hk_s0uM0FW0JCLsL0Rn6GKR77eX8MH0om9Fq3vUfT9ZR6rTCYDit_Stw/s320/2.jpg) |
سجل دخولك إلى المدون ثم افتح لوحة لوحة التحكم وإضغط على قالب |
![تحرير القالب ميني سوفت](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2JBg68BFWKYYp6PJeiwORkfylP_a61IxdShx5C8v2U6pM8Hk-jkxY-Y1b6uNPFuECv_Hadi_gyB-zxij4GtqhPTKtfrNh__-NFqjNIp-gytwOCpxynsd7u6vBaWYl9BPzDksAOdJEHTg/s1600/3.jpg) |
ثم إضغط تحرير HTML |
![الوسم ستايل ميني سوفت](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvcgGWcIrUBgmmftWvdM1V1rmhBnumdSS4Yc4lIkTvbr5MuuDq-ebOlmbd_G_0VBExYVsQfUP_ZR0a343rPTK2oFus-C7Kyzt3tl0tmXaIpVtPwHeAOy81bzAg-IVChoQv_KoVdeGpsoM/s1600/4.jpg) |
ثم وسع القالب من عند هذا الوسم |
الآن أبحث عن الوسم
]]></b:skin>
ثم ضع فوقه مباشرتاً هذا الكود
/*sus code by Mini-Soft */
.Mini-Soft {
border-radius: 100%;
box-shadow: 0px 0px 1px #000;
padding:0;
border:0;
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
}
.Mini-Soft:hover {
box-shadow: 0;
border-radius: 0;
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
cursor:pointer;
}
.Mini-Soft-center {
text-align: center;
}
/*sus code by Mini-Soft */
![مثال على وضع الكود في القالب ميني سوفت](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQSfQvE4HHcINUXRgXFsgOJi7RgG5hXm9KenAWvySqYi9gl7_YF_xA1s8U89egD3emhtDhBIcf15h3j7NC22XjM5hCsWJNKsQBQsIKIywboAR-hEtcPJtIXRGGfFSmD_GfA_rSZ9VW_iY/s320/5.jpg) |
حتى يكون هذا |
![إهب الى تخطيط ميني سوفت](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-zXq2liHJit5e2eO6ftul6xsfRdC480Tt0cSyGzmTMdhZKklrOQtqyRvXn1Y7IgC8CQNzxrkyN3YQ0QoAulUUSb-enJr78kczNqYVyU9WSln8tGS7MEchbH1qX19a1APYxj7vRUZLO9Y/s320/6.jpg) |
أحفظ قالبك ثم أذهب الى التخطيط |
![إضافة آداة ميني سوفت](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvNIRG0i8QCzvb7Pw6PSqwe1ipvQAoaeINVUKFGcWC9vq5OgmWqLysTBvPB7soR53j7JpKWTXp1QTxmDwJLWN1WV1xQjssrjem7Mm2PV5T3WL1l0PecJihREeZEEzRS2nELIzvFEETGL8/s1600/7.jpg) |
أختر إضافة آداة |
![إختيار إضافة آداة جافا سكربت ميني سوفت](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgh-z_WfBLMtDzflWYdHicyJRWpEH35xVKF-ZQaTnT398Zxr_EL9pnLY3ksrcTKlUkyxcLA0kb3C4DKc6WSOxNIGOZ1-8xgUSUuOX8Vn-B9SZ-TiS4RGgYjRrHEYZc357LLaXbAEA6LJOc/s320/8.jpg) |
أختر HTML/JavaScript |
![إدخال الكود ميني سوفت](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7i_6tcwW5xkWrozFZo404Y4DuTnkOS4dkiWnTWc7phKbQtunNtxOJytbgjXSsminVMET125Z4dpSvuRbSncI7eWaKn91TYriXRRry-YGfrmM8frrNfPtjqjK9YYfhe3mQBUdXk5EFU9E/s320/9.jpg) |
ثم أكتب في الخانة رقم واحد أسم الإضافة كما يحول لك في الخانة رقم 2 ضع الكود التالي ثم إضغط حفظ |
<div class="Mini-Soft-center">
<a href="رابط الفيسبوك" target="_blank" title="Facebook"><img class="Mini-Soft" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipdFHGAZlyn0wyx6VgfVdUXf5zgsXBbRk7JBApUswA_wrL9hKHvGQzNkt_RIvh9kvw71DD6V019oTV2tpR8af4t1URY8IWvHEXpxy6irCesCNHPOekqYaIoGMiRh8OCRQkwBtxA2VCrN8/s64-no/Facebook-MiniSoft.png" /></a>
<a href="رابط تويتر" target="_blank" title="Twitter"><img class="Mini-Soft" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgteU9MiPEsxFxXxaZjp8Cydf9RlC2TRVohGyAFjhKl_k0y9gqCHK3gGgvKmJoH68vkQ9qTDVvInfNrJ7X09YnrJzpbEP-wXSUvoTJ4t1Ro5kaRBZWkj_jF2_rJ93TuZd32EbBDsFv6hbo/s64-no/Twitter-MiniSoft.png" /></a>
<a href="رابط يوتيوب" target="_blank" title="YouTube"><img class="Mini-Soft" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCUsN5Ri6fK5GhAPmAvaPhi9LnmTOTXF2_otUh6hotcg3_s7tBA8kVjJFH3B8j_s61wjw-tEyecX4eOHOMQJVlvEB5OL3N0-HRehjykGCQgBqoe-4AUpQlRAIl-nurfl_o-XWwGH_m0nI/s64-no/YouTube-MiniSoft.png" /></a>
<a href="رابط الخلاصة" target="_blank" title="Feed"><img class="Mini-Soft" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKnQSESvVEWE4fjulBsi_tXorqufVbWPKtnv30NX7CdHi5gxPMzP6M1Qmw1UTTxm1Si2pyYLPPpHu8CdiMrmYA-1qOvwPGKFMy4YKPM9XGH1p5ZkzAuUoNSxSmpEe7WwExTAja8vuyBMg/s64-no/RSS-MiniSoft.png" /></a>
<a href="رابط جوجل بلس" target="_blank" title="Google+"><img class="Mini-Soft" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDLDdeMGrTuOaS-gUliNVZFRgqGl1DSZndRUBtJknpzgMM92Kom5hloguwrNzsJ8w1FTXKVXvUakPH5MjQafuFK3Bxnuu3p4rbsAX6yW9JbedmKshtYGIbbLgggMSOJ6DEs-LRla3kNvs/s64-no/GooglePlus-MiniSoft.png" /></a>
</div>
ضع روابط الفيس وتيوتر ويوتيوب والخلاصة وجوجل واضغط حفظأما ما ظُلل بالاحمر فهو الكلمة التي تظهر عند وقوف مؤشر الفأرة على الايقونات![الشكل النهائي للآداة ميني سوفت](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxszBOsXndEZarHIO5-0Hzgu543SFB45IXCpYpTijjZJojv25pIR8g98qurEFSde_6kJoMe4ADDKZi8PfB8r6JjUIKqaxQlYVfsSDk9PJlwZ1XStMqB5e9EBZEr45VJPGKcptuNKwuvfw/s320/10.jpg) |
لتبقى الآداة في النهاية بهذا الشكل الرائع |
تم بحمد الله
علق على هذا الموضوع تعليقات الموقع تعليقات فيسبوك تعليقات Disqus