![[ html ] إنشاء صفحة خطأ 404 أحترافية الجزء الثاني](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHkSErOIzMsLWKmAJty99u7_lcceI8DHx4Q5gFlPlBnnTSAuEk8YsWQAdZBCNoJAR2jw3ODoMRXPhk1b_mHUy42gYWxa1VgrOECHi1JritvbI78euwgeOncZT_Mhy_b4CWuGqCCc1FTcCR/s72-c/Untitledvd-2.png)
![[ جافا سكربت ] زيادة حجم النص او انقاصه داخل HTML](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvsKajTZpsRWSwijDNPzZWU4y0frb-IeMOo9hyoe0vwzDj0lQabogU-NRKEgoLOLgK_oWpbbZRQ7PldV0kBGlWm_E0UdvJhSwujBra9u_TIFyhs8b8fgeaRXhuU5kfvTadX9jY4_6jGTOV/s72-c/Untitled-232.png)
![[ html+css ] صنع و تركيب واجهة احترافيه لمدونة بلوجر - الجزء الاول](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjG-6Y0J7xbBnU2qOfxteEzUaEvg3EJRbIXX1gLjYpL3Kxk0wJGyTUwTPF_KXDwGWoyvjfvaFzMwxAMynZljz4ZNV37dD0DCJ1yq77m8w_jCHrqctKKICOY6tSHg4z5PG3Zv6MtEcLyg7CE/s1600/html-css-%D8%B5%D9%86%D8%B9-%D9%88-%D8%AA%D8%B1%D9%83%D9%8A%D8%A8-%D9%88%D8%A7%D8%AC%D9%87%D9%87-%D8%A7%D8%AD%D8%AA%D8%B1%D8%A7%D9%81%D9%8A%D9%87-%D9%84%D9%85%D8%AF%D9%88%D9%86%D8%A9-%D8%A8%D9%84%D9%88%D8%AC%D8%B1-%D8%A7%D9%84%D8%AC%D8%B2%D8%A1-%D8%A7%D9%84%D8%A7%D9%88%D9%84.png "[ html+css ] صنع و تركيب واجهة احترافيه لمدونة بلوجر - الجزء الاول") |
| [ html+css ] صنع و تركيب واجهة احترافيه لمدونة بلوجر - الجزء الاول |
بسم الله الرحمن الرحيم
والصلاة والسلام على خير خلق الله سيدنا محمد عليه أفضل الصلاة واتم التسليم
السلام عليكم ورحمة الله وبركاته .
مساء الخير او صباح الخير على الكل .
[ html+css ] صنع و تركيب واجهة احترافيه لمدونة بلوجر - الجزء الاول
الواجهة شيء جميل في الموقع صراحه وهي ميزه جداَ جميلة وخرافيه تعطي الموقع منظراَ حقاَ مميز , ايضاَ تعطي الزائر انطباع ان هذا الموقع احترافي .طبعاَ الواجهة في مدونة بلوجر بالأساس لم تكن موجوده لا في العالم العربي ولا الغربي , بل كان هناك واجهات ولاكنها ليست كهذه , حيث ان الواجهات الاخرى التي صنعها بعض المحترفين العرب كانت فكرتها ( صفحة html عبارة عن واجهه ) ويتم ربطها بدومين اخر غير دومين المدونة الاساسي وهذه هي المشكلة, وقد وجدت بالفعل ان كثير من المدونين يبحثون عن طريقة تركيب واجهة لمدونة بلوجر.
ولاكن في موضوعنا اليوم , سنتكلم عن واجهه حقيقية مرتبطه بدومين المدونة الاساسي , وفكرتها بسيطه :)
طبعاَ حقوق الفكره لي, اول من اخترعها واول من ركبها على مدونة بلوجر هو انا واتمنى لكم التوفيق في تركيبها .
على العموم نبداء :
- اولا: يجب ان تكون قد جهزت واجهه لمدونتك عبارة عن html + css المهم انها صفحة وعبارة عن واجهه , وبالمناسبة انا قد جهزت لكم واجهه لمن اراد تركيبها فهي له .
- ثانياَ : نأخذ مثال للواجهه التجريبيه التي اعددتها لكم : من هنا
- ثالثاَ : كود الواجهه التجريبيه لمن اراد تجربتها او حتى تركيبها او تعديلها للموضوع القادم :
<!--design By http://blog.7lolblogger.com -->
<body><div class='wajeha-7lolblogger'>
<a href='http://blog.7lolblogger.com' style='display:none'></a>
<div class='wajeha-all'>
<!-- الصورة الاساسيه -->
<div class='wajeha-7lolblogger-img'><a href='http://blog.7lolblogger.com'><img src='https://lh3.googleusercontent.com/-GlAF2hyXfIg/U0UqIBMhKlI/AAAAAAAAAQU/NaIjvETEYqw/png+t34ow.png'/></a></div>
<!-- الازرار -->
<div class='wajeha-7lolblogger-h1'><h11><a href='http://blog.7lolblogger.com/search?max-results=12'>ادخل للمشاركات</a></h11></div>
<div class='wajeha-7lolblogger-h1'><h11><a href='http://blog.7lolblogger.com/p/my-works.html'>معرض اعمالي</a></h11></div>
<!-- ايقونات التواصل الاجتماعي -->
<ul class="socialicons">
<li><a title="twitter" href="https://twitter.com/7lolblogger " target="_blank">
<img src="http://i39.servimg.com/u/f39/16/89/40/74/t10.png"/></a></li>
<li><a title="facebook" href='https://www.facebook.com/7loll' target="_blank">
<img src="http://i39.servimg.com/u/f39/16/89/40/74/f10.png"/></a></li>
<li><a title="Google+" href='https://plus.google.com/u/0/+jetarax/posts' target="_blank">
<img src="http://i39.servimg.com/u/f39/16/89/40/74/g10.png"/></a></li>
</ul>
</div>
<style>
/* خصائص الواجهه css*/
@font-face {
font-family: 'goth';
src: url(//:) format('no404'), url('https://jetara.googlecode.com/svn/trunk/DroidKufi-Regular.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
body {
background: #191919;
margin: 10px;
}
a {
text-decoration: none;
color: #666;
}
.wajeha-7lolblogger-img {
margin: 10px auto;
display: block;
width: 100%;
float: right;
text-align: center;
background: #111;
margin-top: -5px;
height: 230px;
}
.wajeha-all {
background: #eee;
width: 500px;
margin: 0 auto;
height: 100%;
min-height: 500px;
}
.wajeha-7lolblogger-h1 h11 {
text-align: center;
margin: 5px auto;
display: block;
font: 700 20px goth,tahoma;
color: #555;
text-shadow: 1px 1px #fff;
background: #ddd;
padding: 10px;
clear: both;
border: 1px solid #ccc;
box-shadow: 1px 1px #fff;
border-radius: 4px;
width: 260px;
}
.socialicons {
width: 100%;
float: right;
text-align: center;
padding: 0;
margin: 20px auto;
list-style: none;
}
.socialicons li {
margin: 0 auto;
text-align: center;
display: inline-block;
list-style: none;
padding: 0;
}
</style>
</div></body>
<!--design By http://blog.7lolblogger.com -->
التعديلات :
الاصفر : صورة اللوجو الخاص بموقعك .الاحمر : رابط المدونة .
برتقالي : استبدل فيه فقط رابط مدونتي .
الاخضر : استبدله بأحد صفحات مدونتك .
الازرق : رابط التواصل الاجتماعي لموقعك .
تبقى الان الجزء الثاني نستكمله في الموضوع القادم انشاءالله .
عند نقلك للموضوع او نسخه , حاول ان تذكر المصدر لينتفع الزائر في حال اراد المزيد من المساعده , وايضاَ احتراما وتقديراَ للجهود المبذولة في المواضيع.
معلومات عن التدوينة
صورة التدوينة
ملخص التدوينة:
[ html+css ] صنع و تركيب واجهة احترافيه لمدونة بلوجر - الجزء الاول بسم الله الرحمن الرحيم والصلاة والسلام على خير خلق الله سيدنا محمد...
تاق :
شكرا اخى الكريم موضوع رائع , وشرح وافى
ردحذفحياك الله
حذفلهذا اتابع مدونتك باستمرار لانك ببساطه مبدع بحق
حذفتسلم ايدك اخي عبد لله عمل رائع وجميل
مشكلة بسيطة بخصوص كود تصميم الواجه
بعد تطبيق العملية يظهر خطأ في
< i m g src="http://i39.servimg.com/u/f39/16/89/40/74/g10.png/">
الوسم img غير مغلق يجب اضافة / بين <" ليصبح
< i m g src="http://i39.servimg.com/u/f39/16/89/40/74/g10.png"/>< /li>
شكرا لك اخي دائما مميز
نعم حسان بالفعل , وسم الاغلاق وضعته قبل علامة التنصيص لذالك ظهر الخطاء , اشكرك وتم تعديله .
حذفاووو غاب العملاق ثم رجع بمواضيع جبااارة مشاء الله كالعادة منور .. :)
ردحذفنورك ياغالي .
حذفالسلام عليكم،
ردحذفكيفك أخي ؟ إن شاء الله بخير ~
يعني بجد مواضيعك تضعها وقت الحاجة فعلاً رائعة !
وأنا حبيت هاد الموضوع كثير !
ومنتظر تكملته بفارغ الصبر فشكراً لك أخي على تقديم هذا الموضوع الذي يحتاجها الآخرين !
وتقبل مروري .. تحياتي .!
يوجد موضوع أخر هنا [ html+css ] صنع و تركيب واجهة احترافيه لمدونة بلوجر - الجزء الثاني
حذفكملت الموضوع الثاني ؟
ردحذف[ html+css ] صنع و تركيب واجهة احترافيه لمدونة بلوجر - الجزء الثاني
شكرا لك أخي على المقالة الرائعة :D
ردحذفhttp://www.ar1web.com
شكرا لك ♥.. =q
ردحذفبلوجر و العرب .. إلى اين ؟
اين نضع الكود
ردحذفهناك تكملة للموضوع : [ html+css ] صنع و تركيب واجهة احترافيه لمدونة بلوجر - الجزء الثاني
حذفت1
ردحذف