cufon ,أقوى أداة للحماية من نسخ محتوى موقعك+اختيار اى خط تريده







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

بدأ الشرح على بركة الله ............ اولا: اذهب للموقع الخاص بهذه الاداة من هــــنــــا ثانيا: اولا دعنا نحمل اداة الcufon وننزلها على جهازنا وراح احفظها بأسم cufon.js

ثالثا: الحين فى اول خانة, نختار اى خط تفضله من ملف fonts الموجود ب control panel وأنا من الخطوط المفضله لى هو خط Hacen_Liner_XXL وهذه هو الخط الذى سأستخدمه فى موقعى ليتم استخدامه فى كافة المقالات والكلام اللى بداخل الموقع ثم تابع بالصور الخطوات الاتيه:

بعد التنفيذ راح ينتج لنا ملف اسمه Hacen_Liner_XXL_400.font.js وهو الملف الخاص بالخط, الحين أصبح عندنا ملفين الان, ملف الاداة cufon.js وملف الخط Hacen_Liner_XXL_400.font.js كيف سنستخدمهم أثناء كتابة كود موقعنا؟ نفرض انى راح اصمم صفحة بسيطة وسأكتب بها الاتى

رمز Code:
div id="all">
<h1>www.advphp.com </h1>

<h1 style="color:#FF0000" >web developers world for learning programming & design</h1>

</div>

<legend>
vista-design

<h5>cufon هذا درس لكيفية استخدام ال</h5>
</legend>

الحين حتى نطبق هذه الاداة على هذه الاوسمه سنقوم بالاتى: 1- نستدعى ملف الاداة +ملف الخط

رمز Code:
<script type="text/javascript" src="cufon.js"></script>
<script type="text/javascript" src="Hacen_Liner_XXL_400.font.js"></script>

2-نستدعى ملف مكتبة jquery , وفائدته هنا هو اننى سوف استخدم الid لنتمكن من التعديل على الأوسمه اللى كتبتها,

رمز Code:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

-3الحين حتى ننفذ الأداة , سوف نكتب كود js بسيط :

رمز Code:
<script type="text/javascript">
	Cufon.replace('#all');
	Cufon.replace('legend');
	
</script>

الكود الاول هو استبدال id ال all بهذا الخط , وهنا تكمن أهمية استخدامنا لملف jquery ,لانه بدونه لن نستطيع عمل ذلك الكود الثانى, هو استبدال وسم legend بهذا الخط بحيث سيصبح الكود ككل كالاتى:


 

رمز Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1256" />
<title>www.advphp.com learn how to use cufon</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>


<script type="text/javascript" src="cufon.js"></script>
<script type="text/javascript" src="Hacen_Liner_XXL_400.font.js"></script>
<script type="text/javascript">
	Cufon.replace('#all');
	Cufon.replace('legend');
	
</script>
</head>
<body>

<div id="all">
<h1>www.advphp.com </h1>

<h1 style="color:#FF0000" >web developers world for learning programming & design</h1>

</div>

<legend>
vista-design

<h5>cufon هذا درس لكيفية استخدام ال</h5>
</legend>






</body>
</html>

المرفق

نوع الملف : zip cufon.zip (13.8 كيلوبايت,

انتهي الدرس


http://www.traidnt.net/vb/showthread.php?t=1750787