سبق أن وعدت الإخوة بتكويد استايل مخصص للتحويل، وقد تمّ بحمد الله الانتهاء منه
عدد القوالب التي تمّ تأطيرها هو 112 قالب
سيتطلب تأطير قوالب الاستايل 4 خلفيات مختلفة
أ- خلفيات كبيرة الحجم لتأطير القوالب التي تشغل مساحة كبيرة (مثل تأطير الموضوع)
ب- خلفيات متوسطة الحجم لتأطير القوالب التي تشغل مساحة متوسطة (مثل تأطير القائمة الجانبية)
ج- خلفيات صغيرة الحجم لتأطير القوالب التي تشغل مساحة صغيرة (مثل تأطير فورم تقييم العضو في الردّ أو الموضوع )
د- خلفيات مخصصة للإعلانات
قمت بتقسيم التأطير إلى 9 أقسام حسب حجم الإطار وحسب عرض المساحة التي سيتم تأطيرها :
1- خلفيات كبيرة بعرض 98% ،
يتمّ استبدال الوسم التالي
CODE
<!--big98.cadre.start-->
بكود الإطار العلوي الكبير الحجم مع إضافة الكلاسات التالية
CODE
<br />
wd98<br />
a-center<br />
<br />
ويتمّ استبدال الوسم التالي
CODE
<!--big98.cadre.end-->
بكود الإطار السفلي الكبير الحجم
2- خلفيات كبيرة بعرض 80% ،
يتمّ استبدال الوسم التالي
CODE
<!--big80.cadre.start-->
بكود الإطار العلوي كبير الحجم مع إضافة الكلاسات التالية
CODE
<br />
wd80<br />
a-center<br />
<br />
ويتمّ استبدال الوسم التالي
CODE
<!--big80.cadre.end-->
بكود الإطار السفلي كبير الحجم
3- خلفيات متوسطة بعرض 98% ،
يتمّ استبدال الوسم التالي
CODE
<!--middle98.cadre.start-->
بكود الإطار العلوي المتوسط الحجم مع إضافة الكلاسات التالية
CODE
<br />
wd98<br />
a-center<br />
<br />
ويتمّ استبدال الوسم التالي
CODE
<!--middle98.cadre.end-->
بكود الإطار السفلي المتوسط الحجم
4- خلفيات متوسطة بعرض 80% ،
يتمّ استبدال الوسم التالي
CODE
<!--middle80.cadre.start-->
بكود الإطار العلوي متوسط الحجم مع إضافة الكلاسات التالية
CODE
<br />
wd80<br />
a-center<br />
<br />
ويتمّ استبدال الوسم التالي
CODE
<!--middle80.cadre.end-->
بكود الإطار السفلي متوسط الحجم
5- خلفيات متوسطة بعرض 50% ،
يتمّ استبدال الوسم التالي
CODE
<!--middle50.cadre.start-->
بكود الإطار العلوي متوسط الحجم مع إضافة الكلاسات التالية
CODE
<br />
f-details-l<br />
mrgTable<br />
wd50<br />
a-center<br />
<br />
ويتمّ استبدال الوسم التالي
CODE
<!--middle50.cadre.end-->
بكود الإطار السفلي متوسط الحجم
6- خلفيات متوسطة بعرض 33% ،
يتمّ استبدال الوسم التالي
CODE
<!--middle33.cadre.start-->
بكود الإطار العلوي متوسط الحجم مع إضافة الكلاسات التالية
CODE
<br />
f-details-l<br />
mrgTable<br />
wd33-3<br />
<br />
ويتمّ استبدال الوسم التالي
CODE
<!--middle33.cadre.end-->
بكود الإطار السفلي متوسط الحجم
7- خلفيات صغيرة ،
يتمّ استبدال الوسم التالي
CODE
<!--small.cadre.start-->
بكود الإطار العلوي صغير الحجم
ويتمّ استبدال الوسم التالي
CODE
<!--small.cadre.end-->
بكود الإطار السفلي صغير الحجم
8- خلفيات صغيرة بعرض 14% ،
يتمّ استبدال الوسم التالي
CODE
<!--small14.cadre.start-->
بكود الإطار العلوي صغير الحجم مع إضافة الكلاسات التالية
CODE
<br />
f-details-s<br />
mrgTable<br />
wd14<br />
<br />
ويتمّ استبدال الوسم التالي
CODE
<!--small14.cadre.end-->
بكود الإطار السفلي متوسط الحجم
9- خلفيات مخصصة لتأطير الإعلانات
يتمّ استبدال الوسم التالي
CODE
<!--ads.cadre.start-->
بكود الإطار العلوي
ويتمّ استبدال الوسم التالي
CODE
<!--ads.cadre.end-->
بكود الإطار السفلي
مثال لتكويد إطار ذو خلفيات كبيرة :
لنفترض أنّ تكويد التأطير هو كالآتي
CODE
<div class="bg-center">
<div class="bg-left">
<div class="bg-right">
<div class="bg-top-center">
<div class="bg-top-left"></div>
<div class="bg-top-right"></div>
</div>
المحتوى هنا
<div class="bg-bottom-center">
<div class="bg-bottom-left"></div>
<div class="bg-bottom-right"></div>
</div>
</div>
</div>
</div>
نضيف الكلاسات الخاصة بعرض الإطار في الوسم الأول ليصير بهذا الشكل
CODE
<div class="bg-center wd98 a-center">
<div class="bg-left">
<div class="bg-right">
<div class="bg-top-center">
<div class="bg-top-left"></div>
<div class="bg-top-right"></div>
</div>
المحتوى هنا
<div class="bg-bottom-center">
<div class="bg-bottom-left"></div>
<div class="bg-bottom-right"></div>
</div>
</div>
</div>
</div>
ثمّ يتمّ تقسيم التكويد إلى قسمين، الجزء العلوي
CODE
<div class="bg-center wd98 a-center">
<div class="bg-left">
<div class="bg-right">
<div class="bg-top-center">
<div class="bg-top-left"></div>
<div class="bg-top-right"></div>
</div>
يتمّ استبداله مع
CODE
<!--big98.cadre.start-->
والجزء السفلي
CODE
<div class="bg-bottom-center">
<div class="bg-bottom-left"></div>
<div class="bg-bottom-right"></div>
</div>
</div>
</div>
</div>
يتمّ استبداله مع
CODE
<!--big98.cadre.end-->
يفضّل التعديل على ملف الاستايل converter_style.xml بمحرّر php ويفضّل لو تكون فيه خاصية استبدال النصوص، مثل
محرر editpadline
أو تركيب الاضافة التالية للمحرر ++notepad المشهورhttp://phdesign.com.au/npptoolbucket/ (طريقة التركيب : فقط انقل الملف NppToolBucket.dll للمجلد plugins الخاص بالمحرر)
أو استخدم خدمة بحث واستبدال النص التي توفّرها بعض المواقع مثل http://textmechanic.com/text-tools/basic-text-tools/find-and-replace-text/
مثال مباشر لتأطير مخصص :http://www.pbboard.cf/index.php?page=change_style&change=1&id=10
