من شاهد اعمالى
الجمعة، 24 أبريل 2015
بسم الله الرحمان الرحيم
مرحبا متتبعي الغالى من الأنترنت اليوم في تدوينة جديدة سوف نتطرق الى تركيب كود شريط أخر الأخبار المتحرك على مدونات بلوجر و طبعا كما نعرف لا تستغني المواقع الإخبارية او المواقع ذات النشر المكثف عن مثل هذا الشريط , الشريط يقوم بعرض عناوين آخر المواضيع بشكل متحرك ولافت للانظار مما يجعل الزائر يقبل على الضغط وزيارة الموضوع قبل ان ندخل في طرق التركيب والتنسيق يمكنك القاء نظرة على الشريط في هذه الصورة من مدونتي:
لمعاينة الشريط على مدونتي : هنـــــــــــــــا
طريقة التركيب أضف الكود التالي داخل آداة HTML/JavaScript :
<style>
#cnmunewasbar {
background: #fff;
box-shadow: 0 0 1px #777;
height: 30px;
width: 100%;
}
.cnmunbtile {
background:#008EFA;
color: #fff;
display: inline-block;
float: right;
font: bold 14px/30px tahoma;
height: 100%;
margin-left: -112px;
text-align: center;
width: 110px;
}
.cnmu-newsb-srp {
float: right;
font: 14px/28px tahoma !important;
margin-right: 112px;
}
</style>
<script type="text/javascript">
var cnmuWidth= 100;
var cnmuScrollAmount=0;
var cnmuScrollDelay=80;
var cnmuDirection="right";
var cnmutargetlink="yes";
var cnmunumPosts=10;
var cnmuBulletchar =">>>";
var cnmuimagebullet="yes";
var cnmuimgurl="https://lh6.googleusercontent.com/-YHYwSfOe3XY/VEIv0ZeiOZI/AAAAAAAAE40/3ZHADkTW5Io/s35/jaded.gif";
var cnmufontsize=16;
var cnmubgcolor="transparent";
var cnmulinkcolor="008EFA";
var cnmulinkhovercolor="CD0317";
</script>
<div id="cnmunewasbar">
<span class="cnmunbtile">آخر الأخبار</span>
<script src='https://cnmu.googlecode.com/svn/trunk/2014/newsbar.js' type='text/javascript'></script>
<script type="text/javascript" src="http://www.alribah.com/feeds/posts/default?alt=json-in-script&callback=cnmuAdvRecentPostsScrollerv3&max-results=50" ></script>
<div style='clear: both;'></div>
</div>
#cnmunewasbar {
background: #fff;
box-shadow: 0 0 1px #777;
height: 30px;
width: 100%;
}
.cnmunbtile {
background:#008EFA;
color: #fff;
display: inline-block;
float: right;
font: bold 14px/30px tahoma;
height: 100%;
margin-left: -112px;
text-align: center;
width: 110px;
}
.cnmu-newsb-srp {
float: right;
font: 14px/28px tahoma !important;
margin-right: 112px;
}
</style>
<script type="text/javascript">
var cnmuWidth= 100;
var cnmuScrollAmount=0;
var cnmuScrollDelay=80;
var cnmuDirection="right";
var cnmutargetlink="yes";
var cnmunumPosts=10;
var cnmuBulletchar =">>>";
var cnmuimagebullet="yes";
var cnmuimgurl="https://lh6.googleusercontent.com/-YHYwSfOe3XY/VEIv0ZeiOZI/AAAAAAAAE40/3ZHADkTW5Io/s35/jaded.gif";
var cnmufontsize=16;
var cnmubgcolor="transparent";
var cnmulinkcolor="008EFA";
var cnmulinkhovercolor="CD0317";
</script>
<div id="cnmunewasbar">
<span class="cnmunbtile">آخر الأخبار</span>
<script src='https://cnmu.googlecode.com/svn/trunk/2014/newsbar.js' type='text/javascript'></script>
<script type="text/javascript" src="http://www.alribah.com/feeds/posts/default?alt=json-in-script&callback=cnmuAdvRecentPostsScrollerv3&max-results=50" ></script>
<div style='clear: both;'></div>
</div>
أهم التنسيقات و الإعدادات الخاصة بلكود :
- استبدل http://www.alribah.com برابط مدونتك
- الرقم 80 هو سرعة الشريط كلما قل كلما كان اسرع كلما زاد اصبح بطئ
- ان اردت فتح الروابط في نفس الصفحة استبدل هذه الكلمة yes بهذه no
- هذا 10 هو عدد الموضوعات
- هذا #fff لون خلفية الشريط البيضاء
- هذا #008EFA لون خلفية كلمة آخر الأخبار والتي يمكنك تغييرها هي الأخرى
- وهذا #fff هو لون خط كلمة آخر الأخبار
- الرابط الزهري هو صورة جديد يمكنك استبداله برابط صورة أخرى
- هذا 008EFA هو لون الروابط ملحوظة لا نضيف للون هنا رمز #
- هذا CD0317 هو لون الروابط عند تمرير الماوس وايضاً لا نضيف له الرمز #
- هذا tahoma هو نوع الخط يمكنك استبداله بخط آخر مخصص
- الرقم 14 هو حجم الخط الاول خاص بكلمة آخر الأخبار والثاني خاص بالروابط
- هذا 30 هو بعد الخط من الاعلى للكملة وهذا 28 للروابط
هذه هي اهم الإعدادات والتنسيقات وتجربه موفقة بإذن الله ولا تنسى مشاركتك لتجربتك في جزء التعليقات لنرى مدى فاعلية الكود وأي مشكل إطرحه وسنجيب عنه إن شاء الله .
0 التعليقات
الاشتراك في:
تعليقات الرسالة (Atom)
المشاركات الشائعة
-
بسم الله و الحمد لله و الصلاة و السلام على المصطفى الأمين نبينا محمد العدنان و على الآل و الصحب أجمعين. السلام عليكم و رحمة الله. بعد أن ... -
السلام عليكم ورحمة الله وبركاته أهلآ بكل متابعى و زوار مدونة الغالى الكرام سنتعرف اليوم بأذن الله على كود يبحث عنه الكثير من المدونين و... -
بسم الله الرحمن الرحيم والصلاة والسلام على أشرف المرسلين سيدنا محمد وعلى آله وصحبه أجمعين التطبيق يتيح تركيب العديد من أ... -
نقدم لكم هذه الإضافة الرائعة، التي ستضيف على شعارك لمعانا يجعله أكثر إحترافية بدون الحاجة إلى العمل عليه بالفوطوشوب وتحميل صورة صع... -
طريقة التحكم في حجم الهيدر فى قوالب بلوجر شرح كامل header قسم إضافات بلوجر كل التدوينات السلام عليكم ورحمة الله تعالى و... -
بسم الله الرحمان الرحيم مرحبا متتبعي الغالى من الأنترنت اليوم في تدوينة جديدة سوف نتطرق الى تركيب كود شريط أخر الأخبار المت... -
بسم الله الرحمن الرحيم والصلاة والسلام على أشرف المرسلين سيدنا محمد وعلى آله وصحبه أجمعين إذا كنت ترغب فى أن تجعل مد... -
السلام عليكم ورحمة الله وبركاته اليوم سوف اقدم لكم كيفية اضافة تعريف بصاحب او الكاتب المدونة تحت كل تدوينة اولا ادهب ... -
بسم الله الرحمن الرحيم والصلاة والسلام على أشرف المرسلين سيدنا محمد وعلى آله وصحبه أجمعين سأوضح كيفية تركيبها لصفحات الفيس بوك ... -
أصبح بامكانك اضافة خاصية تسجيل الدخول الى بلوجر من خلال موقعك عن طريق اضافة مربع التسجيل الى الموقع الخاص بك ، فمن خلال هذه ال...