مدونة الحلول

تطبيق عملي بتقنية ال css لصفحة الخطأ الخاصة بالتحديثات الاخيره

noreply@blogger.com (tarik ramdi) — Fri, 01 Jun 2012 23:46:00 +0000

السلام عليكم ورحمة الله وبركاته , منذ ايام قليله مضت تحدثنا عن التحديثات الاخيره التي اجرتها جوجل على لوحة تحكم بلوجر

وقد قلت ان تلك التحديثات تغني عن الميتا تاج اليدويه والتي كنا نضعها في القالب . وكان من ضمن التحديثات التي اشرت اليها هو قيام بلوجر باتاحة الفرصه لاصحاب المدونات بعمل صفحة خطأ . ولمن يعرف ماهي صفحة الخطأ فهي باختصار شديد صفحه تظهر للزائر حين دخوله على رابط موضوع تم مسحه من مدونتك وبامكانك وضع ما تريد في تلك الصفحه فهي الغرض الاساسي والرئيسي منها هو عدم فقدان ثقه زوارك في مدونتك حين يدخلون على رابط ما في مدونتك من خلال احد محركات البحث وتكون النتيجه رساله مفادها الصفحه غير موجوده باقتضاب يجعل مدونتك تفقد مصداقيتها . والبديل والحل لتلك الاشكاليه كانت تلك الصفحه التي يمكنك وضع اعتذار مهذب فيها لزوارك مع حثهم على رؤية المزيد من تدويناتك من خلال روابط تضعها لهم او اي شئ يروق لك .. لروية مثال عملى على الصفحه التي استخدمها .. معروف ان رابط مدونتي كالتالي www.tqarob.com/ اذن ما رايك لو دخلت عليه هكذاwww.pipoxx-flipoxx.blogspot.com/ndhdg جرب واضغط على الرابط الاخير وشاهد النتيجه فالمكتوب بعد نطاق مدونتي مجرد مثال لرابط مفقود في المدونه ... المثال طبعا بسيط ولكني اعتبره يؤدي الغرض بالنسبه لي ويمكنك استخدامه من خلال نسخ الكود الموجود في الاسفل

<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<b><br /></b></div>
<div style="text-align: -webkit-auto;">
<b><span style="color: red; font-family: Verdana; font-size: large;"><span style="line-height: 30px;"><br /></span></span></b></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<span style="color: red; font-family: Georgia, 'Times New Roman', serif;"><span style="font-size: 150px; line-height: 18px;"><b>404</b></span></span></div>
<div class="separator" style="clear: both; text-align: center;">
<span style="color: #0080ff; font-family: Georgia, 'Times New Roman', serif;"><span style="font-size: 150px; line-height: 18px;"><b><br /></b></span></span></div>
<div class="separator" style="clear: both; text-align: center;">
<span style="color: #0080ff; font-family: Georgia, 'Times New Roman', serif;"><span style="font-size: 150px; line-height: 18px;"><b>Error</b></span></span></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<b><span style="font-size: x-large;">الاضافه لم تعد موجود يمكنك الضغط على الزر بالاسفل لطلبها من الدعم الفني</span></b></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://www.tqarob.com/p/free-technical-support.html"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-_z8wNV_oZ9z9Kx2-yUN8oBGH3jcf7asuMY3OZIS2qXK5aLl98Wfuqz3rOJ7wVuraSkXiDRBT5CrxPCGXpjvl23v9vW68S1Ru8tMJUAfNUCtowS9PemKwpOSa7lMtfZUuzqKvytmOx10/s1600/callme.png" /></a></div>
<br /></div>

بعد نسخ الكود قم بالتوجه الى لوحة تحكم بلوجر ثم الى اعدادات وفي نفس التبويب المسمى اعدادات ستجد بالاسفل تبويب يسمى تفضيلات البحث , قم بالضغط عليه وفي منتصف الصفحه ستجد الشكل التالي بالاسفل :

الأخطاء وعمليات إعادة التوجيه

لم يتم العثور على الصفحة المخصصة ?	[تم التعيين] تحرير
عمليات إعادة التوجيه المخصصة ?	ليست هناك عناصر تحرير

قم بالضغط على زر تحرير بجانب جملة لم يتم العثو على الصفحه المخصصه وضع الكود الذي نسخته في الاعلى داخل مربع التحرير وقبل الحفظ استبدل تلك الجمله المكتوبه باللغه العربيه داخل الكود باي جمله تناسبك وتناسب مدونتك كما يمكنك تغيير رابط الصوره والرابط الموجودين في نهاية الكود والمعلمين باللون الازرق والاحمر برابط صفحه في مدونتك وليكن الرئيسيه .. بالتوفيق للجميع .

إدراج ترقيم الصفحات لمدونات بلوجر

noreply@blogger.com (tarik ramdi) — Fri, 01 Jun 2012 22:55:00 +0000

السلام عليكم إخواني الكرام في هذا الدرس سوف نتطرق إلى الطريقة الأسهل في إدراج ترقيم الصفحات لمدونات بلوجر بدون اي تعقيدات تذكر،عليكم سوى تتبع المراحل التالية :

انتقل إلى لوح تحكم مدونتك،إختر "تصميم" ثم إضافة أداة ثم اختر HTML/Javascriptولآن الصق الكود التالي :

<style>
.showpageArea a {
text-decoration:underline;
}
.showpageNum a {
text-decoration:none;
border: 1px solid #EF00BF; /* لون إطار الأرقام */
margin:0 3px;
padding:3px;
}
.showpageNum a:hover {
border: 1px solid #EFB700; /*لون إطار الأرقام عند لمسه بالماوس */
background-color:#00EFEF; /* لون مساحة الإطارعند لمسه بالماوس*/
}
.showpagePoint {
color::#EF2000; /* لون رقم الصفحة المفتوحة */
text-decoration:none;
border: 1px solid #FA2100; /* لون إطار رقم الصفحة المفتوحة */
background:#E9FA00; /*لون مساحة إطار رقم الصفحة المفتوحة */
margin:0 3px;
padding:3px;
}
.showpageOf {
text-decoration:none;
padding:3px;
margin: 0 3px 0 0;
}
.showpage a {
text-decoration:none;
border: 1px solid #A256C3; /* لون إطار "التالي, السابق" */
padding:3px;
}
.showpage a:hover {
text-decoration:none;
}
.showpageNum a:link,.showpage a:link {
text-decoration:none;
color:#0AEA82; /*لون الأرقام */
}

</style>

<script type="text/javascript">

function showpageCount(json) {
var thisUrl = location.href;
var htmlMap = new Array();
var isFirstPage = thisUrl.substring(thisUrl.length-14,thisUrl.length)==".blogspot.com/";
var isLablePage = thisUrl.indexOf("/search/label/")!=-1;
var isPage = thisUrl.indexOf("/search?updated")!=-1;
var thisLable = isLablePage ? thisUrl.substr(thisUrl.indexOf("/search/label/")+14,thisUrl.length) : "";
thisLable = thisLable.indexOf("?")!=-1 ? thisLable.substr(0,thisLable.indexOf("?")) : thisLable;
var thisNum = 1;
var postNum=1;
var itemCount = 0;
var fFlag = 0;
var eFlag = 0;
var html= '';
var upPageHtml ='';
var downPageHtml ='';

var pageCount=5; /* عدد المواضيع المراد عرضها في صفحة الواحدة*/
var displayPageNum=3; /* عدد الصفحات التي يتم إدراجها */
var firstPageWord = 'First';
var endPageWord = 'Last';
var upPageWord ='Prevous';
var downPageWord ='Next';

var labelHtml = '<span class="showpageNum"><a href="/search/label/'+thisLable+'?&max-results='+pageCount+'">';

for(var i=0, post; post = json.feed.entry[i]; i++) {
var timestamp = post.published.$t.substr(0,10);
var title = post.title.$t;
if(isLablePage){
if(title!=''){
if(post.category){
for(var c=0, post_category; post_category = post.category[c]; c++) {
if(encodeURIComponent(post_category.term)==thisLable){
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum;
}
postNum++;
htmlMap[htmlMap.length] = '/search/label/'+thisLable+'?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;
}
}
}
}//end if(post.category){

itemCount++;
}

}else{
if(title!=''){
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum;
}

if(title!='') postNum++;
htmlMap[htmlMap.length] = '/search?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;
}
}
itemCount++;
}
}
for(var p =0;p< htmlMap.length;p++){
if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
if(fFlag ==0 && p == thisNum-2){
if(thisNum==2){
if(isLablePage){
upPageHtml = labelHtml + upPageWord +'</a></span>';
}else{
upPageHtml = '<span class="showpage"><a href="/">'+ upPageWord +'</a></span>';
}
}else{
upPageHtml = '<span class="showpage"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>';
}
fFlag++;
}

if(p==(thisNum-1)){
html += ' <span class="showpagePoint"><u>'+thisNum+'</u></span>';
}else{
if(p==0){
if(isLablePage){
html = labelHtml+'1</a></span>';
}else{
html += '<span class="showpageNum"><a href="/">1</a></span>';
}
}else{
html += '<span class="showpageNum"><a href="'+htmlMap[p]+'">'+ (p+1) +' </a></span>';
}
}
if(eFlag ==0 && p == thisNum){
downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">'+ downPageWord +'</a></span>';
eFlag++;
}
}//end if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
}//end for(var p =0;p< htmlMap.length;p++){
if(thisNum>1){
if(!isLablePage){
html = '<span class="showpage"><a href="/">'+ firstPageWord +' </a></span>'+upPageHtml+' '+html +' ';
}else{
html = ''+labelHtml + firstPageWord +' </a></span>'+upPageHtml+' '+html +' ';
}
}
html = '<div class="showpageArea"><span style="padding: 2px 4px 2px 4px;margin: 2px 2px 2px 2px;border: 1px solid #333; background-" class="showpage">Page '+thisNum+' of '+(postNum-1)+': </span>'+html;

if(thisNum<(postNum-1)){
html += downPageHtml;
html += '<span class="showpage"><a href="'+htmlMap[htmlMap.length-1]+'"> '+endPageWord+'</a></span>';
}
if(postNum==1) postNum++;
html += '</div>';
if(isPage || isFirstPage || isLablePage){
var pageArea = document.getElementsByName("pageArea");
var blogPager = document.getElementById("blog-pager");

if(postNum <= 2){
html ='';
}
for(var p =0;p< pageArea.length;p++){
pageArea[p].innerHTML = html;
}

if(pageArea&&pageArea.length>0){
html ='';
}
if(blogPager){
blogPager.innerHTML = html;
}
}
}
</script>
<script src="/feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" type="text/javascript"></script>
<div style="text-align:right;font-size:10px;color:000000;margin-top:15px;display:none;"> <a href="http://www.monte-escalier-prix.org">www.monte-escalier-prix.org</a></div>

و اخيرا و ليس آخرا قم بإزاحة الأداة تحت "رسائل المدونة الالكترونية" كما هو موضح في الصورة اسفله
في الكود أعلاه يمكنك تغيير الأرقام الحمراءحسب رغبتكم.
1 : var pageCount = 5;
هذه القيمة تمثل عدد المواضيع المراد عرضها في صفحة الواحدة
2 : var displayPageNum = 3;
هذه القيمة تمثل عدد الصفحات التي يتم إدراجها.

ثم قم بالحفظ

noreply@blogger.com (tarik ramdi) — Sun, 27 May 2012 17:52:00 +0000