کد بارگذاری تدریجی تصاویر وبلاگ

حتما تا به حال دیدید که وقتی وارد برخی سایت های وردپرسی یا غیر وردپرسی میشید(اکثرا وردپرسی) عکس ها به صورت آرام لود میشن.

اما تا به حال نمیدونستید که میشه این کار رو با چند خط کد ساده و جالب تر اینکه توی وبلاگ انجام داد.

اولا اینو بگم که کد رو قبل از تگ </head> قرار بدید و دوم اینکه این کد به سرعت لود وبلاگ شما کمک میکنه :

<script type='text/javascript' src='http://tcazz.persiangig.com/shahrivar/l10n.js?ver=20101110'></script> <script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js?ver=1.6.1'></script> <script type='text/javascript' src='http://tcazz.persiangig.com/shahrivar/jquery.lazyload.mini.js?ver=1.5.0'></script> <script type="text/javascript"> jQuery(document).ready(function($){ if (navigator.platform == "iPad") return; jQuery("img").not(".cycle img").lazyload({ effect:"fadeIn", placeholder: "http://taklearn.ir/wp-content/plugins/jquery-image-lazy-loading/images/grey.gif" }); }); </script>

تبدیل طرح های فتوشاپ به CSS با یک کلیک - برای حرفه ای تر ها

امروزه کمتر کسی است که نام فتوشاپ را نشنیده باشد. فتوشاپ نه تنها یک ابزار محبوب برای ویرایش تصاویر است، بلکه بسیاری افراد از این نرم افزار برای طراحی ظاهر وب سایت ها استفاده می کنند. تنوع امکانات و افکت ها یکی از بزرگترین مزایای این نرم افزار شرکت ادوبی است.

شما به عنوان طراح وب سایت، پس از آماده شدن طرح نهایی چگونه آن را به HTML و CSS تبدیل می کنید؟ در ادامه مطلب قصد داریم ابزار مفید و البته رایگانی را معرفی کنیم که با یک کلیک دستورات سی اس اس را محاسبه و تولید می کند.

با خبرنامه بلاگ اسکای آشنا شوید

یکی از امکانات جالب بلاگ اسکای در نسخه جدید، خبرنامه است.

به این صورت که وبلاگ هایی از بلاگ اسکای را که دنبال میکنید، به جای اینکه روزانه به آنها سر زده تا از بروز رسانیشان با خبر شوید ، آدرس این وبلاگ ها را در قسمت تعبیه شده وارد میکنید، پس از آن در قسمت مدیریت خود از بروز رسانی وبلاگ های مورد علاقه یتان با خبر میشوید.

آموزش کامل در ادامه مطلب

 

استایل سیاه و سفید کردن عکس ها که با بردن موس رنگی شوند

با گذاشتن این کد در head قالب خود، تمام تصاویر صفحه سیاه و سفید شده به این صورت که با بردن موس روی عکس ، دوباره رنگی میشوند.

<style> img { filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); filter: gray; -webkit-filter: grayscale(100%); filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); transition: 1.5s; -webkit-transition: 1.5s; -moz-transition: 1.5s; -o-transition: 1.5s; -ms-transition: 1.5s; -khtml-transition: 1.5s; } img:hover{ -webkit-filter: grayscale(0%); -moz-filter: grayscale(0%); -ms-filter: grayscale(0%); -o-filter: grayscale(0%); filter: none; transition: 1.5s; -webkit-transition: 1.5s; -moz-transition: 1.5s; -o-transition: 1.5s; -ms-transition: 1.5s; -khtml-transition: 1.5s; } </style>

قسمت "مدیریت یادداشت" در نسخه جدید بلاگ اسکای

در منوی مدیریت یادداشت ها شما به کلیه یادداشتهای خود دسترسی خواهید داشت. در این بخش شما میتوانید به تفکیک به یادداشتهای منتشر شده، چرکنویس، زمانبندی شده برای آینده، یادداشتهایی که برای انتشار نیاز به تایید مدیریت دارند و یادداشتهایی که به صورت زباله در آمده اند دسترسی خواهید داشت.

 

چرک نویس ها در نسخه جدید بلاگ اسکای کجا رفته اند

چنانکه میدانید در قبل مطالبی که نمیخواستیم فعلا منتشر کنیم را به صورت چرک نویس ذخیره میکردیم . چرک نویس ها هم قسمتی مجزا داشت.

سوال شده که در نسخه جدید به چرک نویس ها دسترسی ندارند 

بهتر است بدانید در نسخه جدید قسمت چرک نویس تغییرات زیادی کرده .

یک اینکه همانطور که در پست قبل اشاره کردیم در هنگام نوشتن، به طور خودکار مطالب به صورت چرک نویس ذخیره میشود .

دوم اینکه در نسخه جدید چرک نویس ها مکان جداگانه ای ندارند و از همان قسمت مدیریت یادداشت ها در دسترس بوده که بر اساس زمان لابلای یادداشت های منتشر شده دیده میشوند.

البته این در صورتی است که در قسمت بالای مدیریت یادداشت ها، گذینه ی "همه یادداشت ها" را انتخواب کنیم.

شما میتوانید با انتخاب گذینه چرک نویس که در همان بالا است ، فقط چرک نویس هارا مشاهده کنید.

کد درج شدن منبع وقتی که از شما کپی میشود

با گذاشتن این کد در head قالب خود ، هنگام کپی شدن از وب شما ، آدرس شما به عنوان منبع همراه هر کپی ، کپی میشود. نمونه این کد را در وب یک نویس میبینید. 

کد عمومی

<script type="text/javascript"> function addLink() { var body_element = document.getElementsByTagName('body')[0]; var selection; selection = window.getSelection(); var pagelink = "<br><br> منبع نوشته: <a href='"+document.location.href+"'>"+document.location.href+"</a><br>کپی کردن بدون ذکر منبع باعث کاهش رتبه وب شما در گوگل میشود"; var copytext = selection + pagelink; var newdiv = document.createElement('div'); newdiv.style.position='absolute'; newdiv.style.left='-99999px'; body_element.appendChild(newdiv); newdiv.innerHTML = copytext; selection.selectAllChildren(newdiv); window.setTimeout(function() { body_element.removeChild(newdiv); },0); } document.oncopy = addLink; </script>

کد مخصوص کاربران بلاگ اسکای

<script type="text/javascript"> function addLink() { var body_element = document.getElementsByTagName('body')[0]; var selection; selection = window.getSelection(); var pagelink = "<br><br> منبع نوشته <a href='"+document.location.href+"'>@blogTitle</a>"; var copytext = selection + pagelink; var newdiv = document.createElement('div'); newdiv.style.position='absolute'; newdiv.style.left='-99999px'; body_element.appendChild(newdiv); newdiv.innerHTML = copytext; selection.selectAllChildren(newdiv); window.setTimeout(function() { body_element.removeChild(newdiv); },0); } document.oncopy = addLink; </script> <div style="display:none"><h2><a href="http://mhmk.ir">mhmk </a></h2></div>

قسمت "یادداشت جدید" در نسخه جدید بلاگ اسکای

نوشتن یک پست جدید در نسخه جدید بلاگ اسکای خیلی متفاوت با نسخه قدیمی است و صد البته خیلی بهتر شده، تغییرات زیادی کرده و امکانات زیادی هم اضافه شده.

همونطور که میدونید برای نوشتن مطلبتون از ستون کناری از قسمت یادداشت جدید باید اقدام کنید.

در ادامه به امکانات و تغییرات این قسمت اشاره میکنم و طرز استفاده اونها رو به بهترین وجه توضیح میدم...