تست
![]() |
| 1- اكتب اسم المشروع او اسم الموقع الذي تريد تحميله 2- اكتب اي شئ تريد 3- اختر مكان حفظ الموقع |
![]() |
| هذا السهم يشير انك لو تريد ان تغلق الجهاز بعد التحميل |
![]() |
| جاري تحميل الموقع |
![]() |
| قائمة الأكثر تعليقاً |
ثم اختر مكان لوضع الاضافة من خلال إضافة آداة.<div id="topcomment">ثم احفظ الآداة و اذهب لمدونتك لترى الآداة وقد تم تشغيلها
<style type="text/css">
.top-commenter-line{
margin:0px;
border-bottom:1px solid #EEE;
background-color:#FFF;
padding:2px 3px;
bottom:-6px;
}
.top-commenter-avatar{
display:inline-block;
vertical-align:middle;
}
#topcomment{
width:300px;
margin:0 auto;
padding:5px;
-moz-box-shadow:-2px 3px 5px rgba(0, 0, 0, 0.1);
-wibkit-box-shadow:-2px 3px 5px rgba(0, 0, 0, 0.1);
box-shadow:-2px 3px 5px rgba(0, 0, 0, 0.1);
}
#topkoment a{color:#B10C0C}
.profile-name-link{padding-left:2px}
</style>
<script type="text/javascript">
var maxTopCommenters = 10, // عدد الأشخاص
minComments = 1, // أدنى حد من التعليقات ليظهر الشخص
numDays = 0, // من كم يوم التعلي30 مثلاً (30) او 0 كل الأوقات
excludeMe = true, // true: استبعاد تعليقاتي الخاصة
excludeUsers = ["Anonymos", "someothertoexclude"], // استبعاد هذه الاسماء
maxUserNameLength = 42, // 0: don't cut, >4: cut usernames
txtTopLine = '<div style="font-weight:bold;display:inline-block;width:2em;text-align:right;"><b>[#].</b></div> [image] [user] ([count])', // عدد القوائم
txtNoTopCommenters = 'No top commentators at this time.',
txtAnonymous = 'غير معروف', // ضع اسم او ارتكه فارغاً للمعلقين بدون اسم
sizeAvatar = 32, // حجم الصورة المصغرة
cropAvatar = true, // إظهار الصورة
urlNoAvatar = 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoMUuI-BDG3D9JTumiHyaxMnRX6BWTSLA4l9DA4s1a-JklEOBGcOaSvxY9usF-_-K-AFkLAS6Py4YQQ-2t7vrJYMssk8jmzkZTVks1BW0O7AldHT73gzgjyiIHOdZpVFAOvksEOjbEkXM/' + sizeAvatar + '/avatar_blue_m_96.png',
urlAnoAvatar = 'http://www.gravatar.com/avatar/00000000000000000000000000000000?d=mm&s=' + sizeAvatar,
urlMyProfile = '', // تعيين إذا لم تقم بوضع اضافة البروفيل
urlMyAvatar = ''; // يمكن ان تكون فارغة او تضع رابط صورة لتظهر على اسمك
// for old IEs & IE modes
if(!Array.indexOf){Array.prototype.indexOf=function(obj){for(var i=0;i<this.length;i++) if(this[i]==obj) return i;return -1;}}
function replaceTopCmtVars(text, item, position){if(!item || !item.author) return text;var author = item.author;var authorUri = "";
if(author.uri && author.uri.$t != "")authorUri = author.uri.$t;var avaimg = urlAnoAvatar;var bloggerprofile = "http://www.blogger.com/profile/";if(author.gd$image && author.gd$image.src && authorUri.substr(0,bloggerprofile.length) == bloggerprofile)avaimg = author.gd$image.src;else {var parseurl = document.createElement('a');if(authorUri != "") {parseurl.href = authorUri;avaimg = 'http://www.google.com/s2/favicons?domain=' + parseurl.hostname;}}if(urlMyProfile != "" && authorUri == urlMyProfile && urlMyAvatar != "")avaimg = urlMyAvatar;if(avaimg == "http://img2.blogblog.com/img/b16-rounded.gif" && urlNoAvatar != "")avaimg = urlNoAvatar;var newsize="s"+sizeAvatar;avaimg = avaimg.replace(/\/s\d\d+-c\//, "/"+newsize+"-c/");if(cropAvatar) newsize+="-c";avaimg = avaimg.replace(/\/s\d\d+(-c){0,1}\//, "/"+newsize+"/");var authorName = author.name.$t;if(authorName == 'Anonymous' && txtAnonymous != '' && avaimg == urlAnoAvatar)authorName = txtAnonymous;var imgcode = '<img class="top-commenter-avatar" height="'+sizeAvatar+'" width="'+sizeAvatar+'" title="'+authorName+'" src="'+avaimg+'" />';if(authorUri!="") imgcode = '<a href="'+authorUri+'">'+imgcode+'</a>';if(maxUserNameLength > 3 && authorName.length > maxUserNameLength)authorName = authorName.substr(0, maxUserNameLength-3) + "...";var authorcode = authorName;if(authorUri!="") authorcode = '<a class="profile-name-link" href="'+authorUri+'">'+authorcode+'</a>';text = text.replace('[user]', authorcode);text = text.replace('[image]', imgcode);text = text.replace('[#]', position);text = text.replace('[count]', item.count);return text;}
var topcommenters = {};
var ndxbase = 1;
function showTopCommenters(json){
var one_day=1000*60*60*24
var today = new Date();
if(urlMyProfile == ""){var elements = document.getElementsByTagName("*");var expr = /(^| )profile-link( |$)/;for(var i=0 ; i<elements.length ; i++)if(expr.test(elements[i].className)){urlMyProfile = elements[i].href;break;}}
if(json && json.feed && json.feed.entry && json.feed.entry.length) for(var i = 0 ; i < json.feed.entry.length ; i++ ) {var entry = json.feed.entry[i];if(numDays > 0){var datePart = entry.published.$t.match(/\d+/g);var cmtDate = new Date(datePart[0],datePart[1]-1,datePart[2],datePart[3],datePart[4],datePart[5]);var days = Math.ceil((today.getTime()-cmtDate.getTime())/(one_day));if(days > numDays) break;}var authorUri = "";if(entry.author[0].uri && entry.author[0].uri.$t != "")authorUri = entry.author[0].uri.$t;if(excludeMe && authorUri != "" && authorUri == urlMyProfile)continue;var authorName = entry.author[0].name.$t;if(excludeUsers.indexOf(authorName) != -1)continue;var hash=entry.author[0].name.$t + "-" + authorUri;if(topcommenters[hash])topcommenters[hash].count++;else{var commenter = new Object();commenter.author = entry.author[0];commenter.count = 1;topcommenters[hash] = commenter;}}
if(json && json.feed && json.feed.entry && json.feed.entry.length && json.feed.entry.length == 200){ndxbase += 200;document.write('<script type="text/javascript" src="http://'+window.location.hostname+'/feeds/comments/default?redirect=false&max-results=200&start-index='+ndxbase+'&alt=json-in-script&callback=showTopCommenters"></'+'script>');return;}
var tuplear = [];
for(var key in topcommenters) tuplear.push([key, topcommenters[key]]);
tuplear.sort(function(a, b){if(b[1].count-a[1].count)return b[1].count-a[1].count;return (a[1].author.name.$t.toLowerCase() < b[1].author.name.$t.toLowerCase()) ? -1 : 1;});
var realcount = 0;
for(var i = 0; i < maxTopCommenters && i < tuplear.length ; i++){var item = tuplear[i][1];if(item.count < minComments)break;document.write('<di'+'v class="top-commenter-line">');document.write(replaceTopCmtVars(txtTopLine, item, realcount+1));document.write('</d'+'iv>');realcount++;}
if(!realcount)
document.write(txtNoTopCommenters);
}
document.write('<script type="text/javascript" src="http://'+window.location.hostname+'/feeds/comments/default?redirect=false&max-results=200&alt=json-in-script&callback=showTopCommenters"></' + 'script>');
</script>
</div>
ثم اختر مكان لوضع الاضافة من خلال إضافة آداة.<div class="g-page" data-href="//plus.google.com/108292020330642658594" data-rel="publisher"></div>ثم إضغط حفظ لتجد الإضافة هكذا ..
<script type="text/javascript">
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/platform.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>
transition: all .4s ease-in-out;
-webkit-transition: all .4s ease-in-out; // google chrome & safari
-moz-transition: all .4s ease-in-out; // firefox
-o-transition: all .4s ease-in-out; //opera
-ms-transition: all .4s ease-in-out; //internet explorer
transition: all .4s ease-in-out;
-webkit- يجعل الكود يعمل على متصفح جوجل كروم و متصفح سفاري
-moz- يجعل الكود يعمل على متصفح فايرفوكس
-o- يجعل الكود يعمل على متصفح اوبرا
-ms- يجعل الكود يعمل على متصفح انترنت اكسبلورر
box-sizing:border-box;
-moz-box-sizing:border-box;
-o-box-sizing:border-box;
-webkit-box-sizing:border-box;
box-shadow: 10px 10px 5px #888;
-moz-box-shadow: 10px 10px 5px #888;
-o-box-shadow: 10px 10px 5px #888;
-webkit-box-shadow: 10px 10px 5px #888;
transform:rotate(7deg);
-moz-transform:rotate(7deg);
-o-transform:rotate(7deg);
-ms-transform:rotate(7deg);
-webkit-transform:rotate(7deg);
-webkit-transition: width 2s;
-moz-transition: width 2s;
-o-transition: width 2s;
-ms-transition: width 2s;
transition: width 2s;
border-radius:25px;
-webkit-border-radius:25px;
-moz-border-radius:25px;
-o-border-radius:25px;
background-image:linear-gradient(to top,#000 0%,#001530 30%);
background-image:-webkit-linear-gradient(to top,#000 0%,#001530 30%);
background-image:-moz-linear-gradient(to top,#000 0%,#001530 30%);
background-image:-o-linear-gradient(to top,#000 0%,#001530 30%);
background-image:-ms-linear-gradient(to top,#000 0%,#001530 30%);
<img src='رابط الصورة'/>الذي يظهر على الصفحة الصورة فقط وعند الضغط عليها لا يحدث اي شئ.
<a href="رابط الموقع">Mini Soft</a>الذي يظهر على الصفحة هو عبارة Mini Soft وعند الضغط عليها يتم التحويل الى صفحة تويتر وهذا الكود هام جداً.
<a href='رابط الموقع'><img src='رابط الصورة'/></a>الذي يظهر على الصفحة الصورة وعند الضغط عليها يتم فتح الموقع.
<a href='رابط الموقع' target='_blank'></a>عند الضغط على الرابط سوف تبقى الصفحة كما هي ويتم فتح الرابط في صفحة جديدة والكود صالح للعمل سواء على رابط او صورة تحتوي على موقع.
<a href='رابط الموقع' target='_blank' title='نبذة عن الموقع'></a>
<b>Mini Soft</b>
<i>Mini Soft</i>
<u>Mini Soft</u>
<center>mini soft</center>
![]() |
| من لوحة تحكم مدونتك إذهب إلى قالب |
![]() |
| ثم إضغط تحرير HTML |
]]></b:skin>وذلك بالضغط على Ctrl + F ثم ضع فوقه مباشرتاً هذا الكود :
.feed-links{display:none !important;}ليبقى اخيراً هكذا :
![]() |
| هذا هو شكل الآداة التي نتحدث عنها |
![]() |
| من لوحة التحكم إختر التخطيط |
![]() |
| ثم إختر المكان في مدونتك واضغط على إضافة آداة |
![]() |
| إختر HTML/JavaScript |
![]() |
| ثم ضع الكود التالي في الجزء الاصفر هذا ثم إضغط حفظ |
<script type="text/javascript">استبدل هذا الرقم الأحمر برقم حسابك على جوجل بلس
(function(){window.___gcfg={'lang':'ar'};
var po=document.createElement('script');
po.type='text/javascript';
po.async=true;
po.src='https://apis.google.com/js/plusone.js';
var s=document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(po,s);
})();
</script>
<div class="wc-gplusmod">
<div class="g-plus" data-action="followers" data-height="290" data-href="https://plus.google.com/108292020330642658594?prsrc=2" data-source="blogger:blog:followers" data-width="290"/>
</div>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js' type='text/javascript'/>
![]() |
| بعد الدخول على رابط الآداة ستجد الموقع كهذذا إضغط على Add to Firefox |
![]() |
| ثم انتظر حتى يكتمل التحميل |
![]() |
| حتى تأتي هذه النافذة و اضغط Install Now |
![]() |
| بعد الضغط على تثبيت الاداة ستجدها هنا بهذا الشكل |
![]() |
| ستجد الاداه هكذا في اسفل الموقع مقسومة نصفين النصف الاكبر هو كتابة الـ HTML و XML النصف الاصغر هو كتابه CSS |
![]() |
| انظر لهذا المربع الذي يتخلله سهم صغير, كل شغلنا سيكون من هذا المربع اضغط عليه وجرب الوقوف على اي شئ في المدونة |
![]() |
| انا وقفت على عنوان موضوع انظر ,, تم تحديده بإطار ازرق اضغط عليه الان وانظر لمكان الاداة |
![]() |
| انظر جيداً 1- هو مكان العنوان في صفحة html 2- هو مكان العنوان في صفحة CSS |
![]() |
| انظر هنا ,, ضغطت على فونت حتى اعدل على اي شئ اريده وانفترض انني اريد تكبير الفونت؟؟ سأقوم بتغيير الرقم 18 الى 30 وننظر في الصورة التاليه |
![]() |
| تم تكبير العنوان |
![]() |
| قُم بالضغط على عنوان الكود الذي هو رقم واحد ثم اضغط عليه كليك يمين وانسخه من كوبي رقم اتنين وابحث عنه في المدونة وقم بتعديل ما تريد |
<b:skin><![CDATA[اما في المواقع والمدونات الآخرى وايضاً بلوجر يتم استخدام الآكواد بالشكل التالي:
body {
background: #00CCFF;
margin: 0;
padding: 0;
color: #333333;
font: normal normal 14px 'Droid Arabic Naskh',Arial,Tahoma,Sans-Serif;
text-align: center
}
a:link,a:visited {
color: #13A7DA;
text-decoration: none;
outline: none;
}
a:hover,a:active {
color: #292929;
text-decoration: none;
outline: none;
}
]]></b:skin>
<style type='text/css'>ما هي القاعدة الثابتة في كتابة أكواد CSS ؟ التالي ..
body {
background: #00CCFF;
margin: 0;
padding: 0;
color: #333333;
font: normal normal 14px 'Droid Arabic Naskh',Arial,Tahoma,Sans-Serif;
text-align: center
}
a:link,a:visited {
color: #13A7DA;
text-decoration: none;
outline: none;
}
a:hover,a:active {
color: #292929;
text-decoration: none;
outline: none;
}
</style>
<div id='welcome'>to MiniSoft</div>
نلاحظ أن id اصبح ( # ) وكتبت بجانبه welcome لأنها مكتوبة بجانب id في صفحة HTML#welcome {color: #000000 ;font: normal normal 12px Tahoma, Geneva, sans-serif;}
<div class='mini'>soft</div>-class مكتوب في صفحة CSS
.mini {نلاحظ أن class اصبح نقطة ( . ) و كتبت بجانبها mini لأنها مكتوبة بجانب class في صفحة HTML
background-color: #CC0000;
text-align: center;
}
<div class='mini'>ميني سوفت على تويتر</div>كل هذه الوسوم المتشابهه تكتب في صفحة CSS هكذا:
<div class='mini'>ميني سوفت على جوجل كروم</div>
<div class='mini'>ميني سوفت ع الفيس بوك</div>
.mini {.إذاً فهمنا أن الوسم هو الملون و الذي يوجد بداخله كلمات كما رأينا, هذا بعكس المعرف id لا يمكن ان يتكرر نفس الوسم في نفس الصفحة او القالب كاملاً,,,
background-color: #CC0000;
text-align: center;
}
![]() |
| بمجرد دخولك للموقع ستجد هذه النافذة 1- اكتب مثلاً تعليقات الفيس بوك 2- اكتب اي شئ بالانجليزية 3- اتركها اخرى 4- اضغط متابعة |
![]() |
| اكتب ما تراه امامك في هذا المربع ثم إضغط متابعه |
![]() |
| ستنتقل الى هذه الصفحة إضغط على Edit App |
![]() |
| ثم إحفظ الرقم الذي تجده في هذا المكان لأننا سوف نحتاجه |
![]() |
| من لوحة تحكم مدونتك إختر قالب |
![]() |
| ثم إختر تحرير HTML |
<HTML
<HTML prefix='og: http://ogp.me/ns#' xmls:fb='http://ogp.me/ns/fb#'
</body>
<div id='fb-root'/><script>window.fbAsyncInit = function() {FB.init({xfbml: true, appId: كود الفيس بوك });};(function() {var e = document.createElement('script'); e.async = true;e.src = document.location.protocol +'//connect.facebook.net/ar_AR/all.js'document.getElementById('fb-root').appendChild(e);}());</script>
<div class='comments' id='comments'>
الآن ابحث عن الوسم <head> ثم ضع تحته هذا الكود<b:if cond='data:blog.pageType == "item"'><div><script src='http://connect.facebook.net/ar_AR/all.js#xfbml=1'/><fb:comments width='600' expr:href='data:post.url' expr:title='data:post.title' expr:xid='data:post.id' migrated='1'/></div></b:if>
<!--Start Metadata Facebook -->
<b:if cond='data:blog.pageType == "item"'>
<meta expr:content='data:blog.pageTitle' property='og:title'/>
<meta expr:content='data:blog.url' property='og:url'/>
<b:else/>
<meta expr:content='data:blog.title' property='og:title'/>
<meta expr:content='data:blog.homepageUrl' property='og:url'/>
</b:if>
<meta content='اسم المدونة مع وصف قصير ' property='og:site_name'/>
<meta content='صورة 256×256 تعبر عن مدونتك' property='og:image'/>
<meta content='كود الفيسبوك' property='fb:app_id'/>
<meta content='معرف حسابك ع الفيسبوك' property='fb:admins'/>
<meta content='website' property='og:type'/>
<meta content='article' property='og:type'/>
<!-- Metadata Facebook End -->
![]() |
| 1- اضغط على اسم حسابك كما بالصورة 2- ستجد الاسم هكذا |
{ما يهمنا هو هذا الكود الملون بالاحمر وهو معرف حسابك , ضعه في مكانه الذي اشرنا اليه ثم انتقل الى هذا الرابط ( هنا ) واتبع التالي:
"id": "100004490551583",
"name": "\u0645\u064a\u0646\u064a \u0633\u0648\u0641\u062a",
"first_name": "\u0645\u064a\u0646\u064a",
"last_name": "\u0633\u0648\u0641\u062a",
"link": "http://www.facebook.com/Min0oSoft",
"username": "Min0oSoft",
"gender": "male",
"locale": "ar_AR"
}
| سيفتح معك الرابط صفحة بها كلمة الإعدادات كما ترى |