مرجع بلاگ اسکای

معرفی کد ها و امکانات جدید برای وبلاگ نویسان بلاگ اسکای - قالب های حرفه ای بلاگ اسکای

مرجع بلاگ اسکای

معرفی کد ها و امکانات جدید برای وبلاگ نویسان بلاگ اسکای - قالب های حرفه ای بلاگ اسکای

نمایش نظرات در ادامه مطالب بلاگ اسکای

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

در ادامه نحوه به نمایش در آوردن نظرات کاربران در ادامه مطالب را توضیح میدهیم.

1- در ابتدا تگ <header /> رو در بین تگ های <head></head> قرار بدید.

2- سپس کدهای اچ تی ام ال مربوط به بلاک نمایش عناصر به همراه اسکریپت نظردهی را دربین کدها و بعد از تگ های بسته </many></post> قرار دهید.به اینصورت :

<post>

<many>

. . .

</many>

</post>

...

</comment>

<comment>
<script>
	blogsky.ajax.onCommentSubmitSuccess = function(e) {
		document.getElementById("comment-form").innerHTML = "<div class=\"message\">" + e.data + "</div>";
	}

blogsky.ajax.onCommentSubmitFailure = function(e) {
		document.getElementById("comment-errors-message").innerHTML = e.error;
	}

blogsky.ajax.onCommentRateBegin = function(e) {
		switch (e.rateType) {
			case "plus":
				var commentRatePlus = document.getElementById("comment-rate-plus-count-" + e.id);
				commentRatePlus.innerHTML = parseInt(commentRatePlus.innerHTML) + 1;
				break;
			case "minus":
				var commentMinusPlus = document.getElementById("comment-rate-minus-count-" + e.id);
				commentMinusPlus.innerHTML = parseInt(commentMinusPlus.innerHTML) + 1;
				break;
		}
	}

blogsky.ajax.onCommentRateFailure = function(e) {
		switch (e.rateType) {
			case "plus":
				var commentRatePlus = document.getElementById("comment-rate-plus-count-" + e.id);
				commentRatePlus.innerHTML = parseInt(commentRatePlus.innerHTML) - 1;
				break;
			case "minus":
				var commentMinusPlus = document.getElementById("comment-rate-minus-count-" + e.id);
				commentMinusPlus.innerHTML = parseInt(commentMinusPlus.innerHTML) - 1;
				break;
		}
		var commentRateErrorMessage = document.getElementById("comment-rate-error-message-" + e.id);
		commentRateErrorMessage.innerHTML = e.error;
		commentRateErrorMessage.style.display = "block";
		setTimeout(function () { commentRateErrorMessage.style.display = "none"; }, 3000);
	}

function insertCommentSmiley(smiley) {
		var inputComment = document.getElementById("comments").getElementsByTagName("TEXTAREA")[0];
		blogsky.general.insertAtCursor(inputComment, smiley);
	}

document.onclick = function (e) {
		if (e.target.id != "smiley-button") {
			var smileyBox = document.getElementById("smiley-box");
			if (smileyBox != null) smileyBox.style.display = "none";
		}
	}
</script>
<div id="comments">
	<div class="title">نظرات (@commentCount)</div>
	<many>
	<div class="comment" id="comment-@id">
		<div class="name"><gravatar><img class="gravatar" src="@image" alt="" /></gravatar><a href="#comment-@id"><country><img src="@flagImage" title="@name" alt="" /></country> @authorName</a></div>
		<div class="datetime">@date ساعت @time</div>
		<div class="text">@text</div>
		<div class="web"><a href="@authorWebsite" title="وب/وبلاگ" target="_blank">@authorWebsite</a></div>
		<rate>
		<div class="rate">
			امتیاز: 
			<span onclick="@ajaxPlusAction" title="مثبت" class="plus"><span style="font-size: 10pt;" id="comment-rate-plus-count-@id">@plusCount</span> <img src="http://www.blogsky.com/images/template/blue/plus.gif" alt=""></span>
			<span onclick="@ajaxMinusAction" title="منفی" class="minus"><span style="font-size: 10pt;" id="comment-rate-minus-count-@id">@minusCount</span> <img src="http://www.blogsky.com/images/template/blue/minus.gif" alt=""></span>
			<div id="comment-rate-error-message-@id" class="message"></div>
		</div>
		</rate>
		<div style="clear: both;"></div>
		<reply>
			<div class="reply">
			<b>پاسخ:</b><br />@text
			</div>
		</reply>
	</div>
	</many>
	<paging />
	<message>
	<div class="comment">
		<div class="message">@text</div>
	</div>
	</message>
	<form>
	<div id="comment-form">
		<gravatarHelp>
			<div id="gravatar-help">@message</div>
		</gravatarHelp>
		<div class="comment">
			<div style="text-align: center;">
				<br />
				<table id="form-box" cellspacing="2">
					<tr>
						<th>نام :</th>
						<td><nameBox /></td>
					</tr>
					<tr>
						<th>ایمیل :</th>
						<td><emailBox /></td>
					</tr>
					<tr>
						<th>وب/وبلاگ :</th>
						<td><websiteBox /></td>
					</tr>
					<tr>
						<td colspan="2" style="text-align: right">
					<div style="float: right;">
						<commentBox />
					</div>
					<smiley>
					<div style="position: relative; float: left;">
						<img src="http://www.blogsky.com/images/smileys/101.png" id="smiley-button" onclick="document.getElementById('smiley-box').style.display='block';" style="cursor: pointer;" alt="" />
						<div id="smiley-box">
							<img src="http://www.blogsky.com/images/smileys/101.png" alt="" title="لبخند" onclick="insertCommentSmiley(':لبخند:')" />
							<img src="http://www.blogsky.com/images/smileys/102.png" alt="" title="چشمک" onclick="insertCommentSmiley(':چشمک:')" />
							<img src="http://www.blogsky.com/images/smileys/103.png" alt="" title="خجالت" onclick="insertCommentSmiley(':خجالت:')" />
							<img src="http://www.blogsky.com/images/smileys/104.png" alt="" title="ناراحت" onclick="insertCommentSmiley(':ناراحت:')" />
							<img src="http://www.blogsky.com/images/smileys/105.png" alt="" title="خوشتیپ" onclick="insertCommentSmiley(':خوشتیپ:')" />
							<img src="http://www.blogsky.com/images/smileys/106.png" alt="" title="عصبانی" onclick="insertCommentSmiley(':عصبانی:')" />
							<img src="http://www.blogsky.com/images/smileys/107.png" alt="" title="خنده" onclick="insertCommentSmiley(':خنده:')" />
							<img src="http://www.blogsky.com/images/smileys/108.png" alt="" title="زبان" onclick="insertCommentSmiley(':زبان:')" />
							<img src="http://www.blogsky.com/images/smileys/109.png" alt="" title="مسخره" onclick="insertCommentSmiley(':مسخره:')" />
							<img src="http://www.blogsky.com/images/smileys/110.png" alt="" title="کلافه" onclick="insertCommentSmiley(':کلافه:')" />
							<img src="http://www.blogsky.com/images/smileys/111.png" alt="" title="گریه" onclick="insertCommentSmiley(':گریه:')" />
							<img src="http://www.blogsky.com/images/smileys/112.png" alt="" title="پوزخند" onclick="insertCommentSmiley(':پوزخند:')" />
							<img src="http://www.blogsky.com/images/smileys/113.png" alt="" title="بدجنس" onclick="insertCommentSmiley(':بدجنس:')" />
							<img src="http://www.blogsky.com/images/smileys/114.png" alt="" title="تعجب" onclick="insertCommentSmiley(':تعجب:')" />
							<img src="http://www.blogsky.com/images/smileys/115.png" alt="" title="ناخوش" onclick="insertCommentSmiley(':ناخوش:')" />
							<img src="http://www.blogsky.com/images/smileys/116.png" alt="" title="بیخیال" onclick="insertCommentSmiley(':بیخیال:')" />
							<img src="http://www.blogsky.com/images/smileys/117.png" alt="" title="بوس" onclick="insertCommentSmiley(':بوس:')" />
							<img src="http://www.blogsky.com/images/smileys/118.png" alt="" title="خواب" onclick="insertCommentSmiley(':خواب:')" />
							<img src="http://www.blogsky.com/images/smileys/119.png" alt="" title="عاشق" onclick="insertCommentSmiley(':عاشق:')" />
							<img src="http://www.blogsky.com/images/smileys/120.png" alt="" title="راضی" onclick="insertCommentSmiley(':راضی:')" />
							<img src="http://www.blogsky.com/images/smileys/121.png" alt="" title="کسل" onclick="insertCommentSmiley(':کسل:')" />
							<img src="http://www.blogsky.com/images/smileys/122.png" alt="" title="نخبه" onclick="insertCommentSmiley(':نخبه:')" />
							<img src="http://www.blogsky.com/images/smileys/123.png" alt="" title="گل" onclick="insertCommentSmiley(':گل:')" />
							<img src="http://www.blogsky.com/images/smileys/124.png" alt="" title="هدیه" onclick="insertCommentSmiley(':هدیه:')" />
							<img src="http://www.blogsky.com/images/smileys/125.png" alt="" title="قلب" onclick="insertCommentSmiley(':قلب:')" />
							<img src="http://www.blogsky.com/images/smileys/126.png" alt="" title="نت" onclick="insertCommentSmiley(':نت:')" />
						</div>
					</div>
					</smiley>
					<div style="clear: both;"></div>
						</td>
					</tr>
					<tr>
						<td colspan="2" style="text-align: center">
							<captcha />
						</td>
					</tr>
					<tr>
						<td colspan="2" style="padding-bottom: 5px; text-align: right;">
							<saveProfileBox /> <label for="bs-input-comment-save-profile"> مشخصات مرا به خاطر بسپار</label>
						</td>
					</tr>
					<tr>
						<td colspan="2" style="text-align: right">
							ایمیل شما بعد از ثبت نمایش داده نخواهد شد
						</td>
					</tr>
					<tr>
						<td colspan="2" id="comment-errors-message">
						</td>
					</tr>
					<tr>
						<td colspan="2" style="text-align: center">
							<input type="button" onclick="@ajaxAction" value=" ارسال نظر " />
						</td>
					</tr>
				</table>
			</div>
		</div>
	</div>
	</form>
</div>
</comment>

3- برای اینکه وقتی به ادامه مطلب مراجعه کردید نظرات در پائین مطالب به نمایش در بیاد، تگ <comment /> را قبل از تگ </many></post> قرار دهید. به اینصورت :

<post>

<many>

. . .

</many>

</post>

</code>

</div>

4- کد css ای که در پائین مشاهده میکنید برای استایل دهی به این بلاک نوشته شده که بصورت پیش فرض هست. ولی شما می تونید برای رسیدن به نتیجه مطلوب خود این کدها رو تغییر بدید.این کدها رو بین تگ های <style></style> قرار بدید.

#comments { padding-top: 20px; }
#comments .message { padding: 10px 0; text-align: center; color: red; }
#comments .title { margin-bottom: 20px; font-weight: bold; direction: rtl; text-align: center; }
#comment-form { margin-top: 30px; }
#comment-form .message { padding: 10px 0; color: Red; font-size: 9pt; font-weight: bold; text-align: center; }
.comment { padding-bottom: 5px; margin-bottom: 15px; text-align: right; direction: rtl; border-bottom: 1px solid #B3B9C3; }
.comment .name { margin-bottom: 3px; font-weight: bold; color: #4182b8; }
.comment .datetime { margin-bottom: 5px; color: #777; }
.comment .text { margin-bottom: 10px; text-align: justify; line-height: 1.5em; }
.comment .web { text-align: left; direction: ltr; float: left; }
.comment .rate { float: right; color: #777; position: relative; }
.comment .rate .plus { cursor: pointer; margin-right: 2px; }
.comment .rate .minus { cursor: pointer; margin-right: 4px; }
.comment .rate .message { padding: 5px; background-color: white; border: 1px solid #B3B9C3; position: absolute; display: none; white-space: nowrap; opacity: 0.9; color: red; top: -5px; right: 30px; }
.comment .reply { margin: 5px 0; padding: 5px; border-right: 5px solid #d1d1d1; line-height: 1.5em; text-align: justify; background-color: #f4f4f4; }
.bs-validation-summary-errors { background-color: #FFEEEE; border: 1px solid red; color: red; margin-bottom: 10px; padding: 5px 20px 5px 5px; }
.bs-validation-summary-errors li { padding: 1px 0; }
#contact-box, #form-box { direction: rtl; border: 0; margin: auto; }
#contact-box th, #form-box th { text-align: right; width: 70px; font-weight: normal; }
#contact-box td, #form-box td { text-align: right; width: 315px; }
#contact-box input[type=text], #form-box input[type=text] { font-size: 10pt; padding: 3px; width: 280px; border: 1px solid #AFAFAF; }
#contact-box textarea, #form-box textarea { font-size: 10pt; padding: 3px; width: 354px; height: 160px; border: 1px solid #AFAFAF; }
.bs-input-validation-error { background-color: #FFEEEE; }
#smiley-box { position: absolute; display: none; background-color: #fff; z-index: 10; left: 0; border: 1px solid #999; width: 155px; padding: 2px; }
#smiley-box img { cursor: pointer; margin: 2px; }
#gravatar-help { direction: rtl; padding: 10px 0; text-align: center; }
.gravatar { float: left; }
.html { direction: ltr; text-align: left; }
.bs-ltr { direction: ltr; text-align: left; }
#bs-input-search { width: 100px }
.bs-captcha-box { margin: 5px 0; text-align: center; }
.bs-captcha-image { vertical-align: bottom; }
.bs-captcha-refresh { background: url("http://www.blogsky.com/images/template/blue/reload.gif") no-repeat; cursor: pointer; display: inline-block; height: 22px; width: 22px; vertical-align: bottom; border: 1px solid #afafaf; }
.bs-captcha-code { color: #000000; direction: ltr; font-family: verdana !important; font-size: 14pt !important; font-weight: bold; padding: 2px !important; text-align: left; text-transform: uppercase; width: 85px !important; height: 20px; letter-spacing: 3px; }
#contact-box .bs-captcha-code { width: 110px !important; }
#contact .header { margin: 10px auto; width: 400px; }
#contact .title { font-weight: bold; font-size: 9pt; }
#contact .message { color: red; direction: rtl; text-align: right; margin-top: 10px; }

5- تغییر آدرس لینک نظرات : درون کدهای قالبتون تگ بلاک <commentLink> </commentLink> رو پیدا کنید و هرکدی بین این دو تگ بود حذف کنید و قطعه کد زیر رو که با رنگ متفاوت مشخص شده ، بین دو تگ قرار بدید.

<a href="@href" title="نظرات">نظرات [@count]</a>

</commentLink>

تبریک، شما موفق شدید.

نمایش نظرات در ادامه مطلب بلاگ اسکای بلاک نظرات بلاگ اسکای 1code یک کد

محمد حسین جمعه 25 مرداد 1392 ساعت 02:23

نظرات 12 + ارسال نظر

سورنا جمعه 25 مرداد 1392 ساعت 12:54 http://bachehayedirooz.blogsky.com

سلام دمت گرم داداش

قربونت

امیر شنبه 26 مرداد 1392 ساعت 14:10 http://technews.s2a.ir

سلام در قالب ابی مسطح وبلاگ خودتون وقتی این کد هارو میزنم کل استایل و همه چی درسته ولی دکمه ارسال نظر هرگز کار نمیکنه خواهش میکنم راهنمایی کنید من سردرگم موندم

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

امیر شنبه 26 مرداد 1392 ساعت 16:13 http://technews.s2a.ir

ببخشید ولی من همین امروز ظهر دوباره حتی قالب را هم دوباره از اول گزاشتم ولی درست نشد اگه میشه یه نگاهی بندازید ببینید شاید فهمیدی مشکل از کجاست
کل مراحل را هم با دقت انجام دادم

نظرات در ادامه مطلب نیز به درستی در قالب مسطح اضافه شد یک بار دیگه قالب و بذارین

امیر شنبه 26 مرداد 1392 ساعت 16:32 http://technews.s2a.ir

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

مرسییییی لطف داری وظیفه بود

محمد یکشنبه 3 شهریور 1392 ساعت 19:18 http://2fanoos.blogsky.com/

سلام دوست عزیز...
واقعا بابت وبلاگ خوبی که داری ممنونم،واقعا مفیده...
من هر چقدر تلاش کردم نتونستم!!!!
میدونم یه مقدار اذیت میشین ولی اگه لطف کنین شما برام اینکار رو انجام بدین...
لینک فایل نوت پد:
http://s2.picofile.com/file/7908341498/weblog.txt.html
اگر امکانش بود اینکار رو انجام بدین....
خیلی خیلی ممنونم...
یاعلی

اولا شما قاب و با فرمت ansi ذخیره کردی تو این نوت پد و به این خواطر فونت هاش خراب شده ... یه بار دیگه یونی کد ذخیرش کن تا درستش کنم.
دوما از نظر سئو هم وضع قابتون داغونه اگه خواستید این هم براتون درست میکنم البته با هزینه.

محمد سه‌شنبه 5 شهریور 1392 ساعت 16:06

دمت جیلیز و ویلیز داداش

قربونت

سلام شنبه 16 شهریور 1392 ساعت 22:52 http://gameorder.blogsky.com

سلام دوست عزیز ممنون ازاین پستت ولی وقتی که گذاشتم رنگ کلمات دیده نمیشه و سفیده خواهش میکنم کمک کنید

رنگ چه کلماتی سفیده ؟ من که دیدم مشکلی نداشت

lambord یکشنبه 17 شهریور 1392 ساعت 10:36 http://gameorder.blogsky.com

بخش نظرات برو توی مطالبی که نظر فرستادن رو ببین

استایلاش و دست کاری کردی ؟

LAMBORD یکشنبه 17 شهریور 1392 ساعت 12:46 http://GAMEORDER.BLOGSKY.COM

خیر

lambord یکشنبه 17 شهریور 1392 ساعت 13:17 http://gameorder.blogsky.com

درستش کردم ممنون

خواهش میکنم

پیمان سه‌شنبه 8 بهمن 1392 ساعت 23:11 http://musicnote.blogsky.com/

سلام داداش
من کدارو گذاشتم
و ادامه مطالب امد
اما نصفش تو صفحه نمایش داده میشه
فکر کنم باید کد CSS اش تغییر کنه
من خودم بلد نیستم
اگه میتونی بلدی لطفا کمک کن
ممنون