parsgreen.com
article

آموزش نحوه درج تصویر در وبلاگ

web-blog-image

شاید وبلاگ و وبلاگ نویسی در نگاه اول کاری ساده و راحت به نظر برسد اما کافی است وارد این گود شوید تا کم کم با سختی های آن دست و پنجه نرم کرده، به دشواری های آن نیز در کنار شیرینی مدیریت یک وبلاگ پی ببرید، البته این موضوع تا حدود زیادی نیز نسبی است و به میزان آشنایی شما با مسائل فنی و تجربه بستگی دارد، به هر صورت، در این مطلب می خواهیم به یکی از رایج ترین مشکلات وبلاگ نویسان یعنی آموزش نحوه درج تصویر در مطالب وبلاگ بپردازیم، چرا که انجام این کار در حالت معمول با یک کپی و paste ساده امکان پذیر نیست و نیازمند آشنایی با اصول وب و تجربه کافی است.

درج تصویر از صفحه ای در وب، در وبلاگ


در مورد قرار دادن تصاویر در وبلاگ، باید بین دو مورد تفکیک قائل شویم، یک حالت وقتی است که تصویر مورد نظر، در صفحه ای دیگر روی وب (به صورت آنلاین) قرار دارد و حالت دیگر وقتی است که عکس ها روی هارد کامپیوتر ذخیره شده یا بر روی حافظه های جانبی مثل فلش درایوها وجود دارند؛ باید توجه داشت که تصاویر در وب تنها در صورتی قابل روئیت هستند که بر روی یک سرور آنلاین، در دسترس باشند، لذا روش کپی تصاویر از صفحات دیگر معمولا توصیه نمی شود، چرا که ممکن است آن فایل بعدا توسط مدیر سایت یا وبلاگ مبداء حذف گردد، از طرفی رعایت اخلاق حرفه ای حکم می کند، تا حد امکان سعی کنیم محتوایی جدید بسازیم نه اینکه به کپی برداری صرف که به خودی خود ارزش خاصی ندارد بپردازیم؛ به هر صورت محض اطلاع، این شیوه را در ادامه آموزش می دهیم.
اگرچه اکثر کاربران عکس ها را به صورت مستقیم در صفحه کپی می کنند اما شیوه استاندار درج تصویر، به صورت کپی آدرس عکس و تنظیم آن در مطلب مورد نظر است، همانطور که پیش تر گفتیم، هر تصویری که در وب می بینید، در سروری قرار دارد، آدرس کامل آن تصویر نیز معمولا با کلیک راست روی عکس بدست می آید، به طور مثال آدرس یک عکس فرضی ممکن است به صورت زیر باشد.
http://yoursite.com/image/example.jpg
همانطور که می بینید، این آدرس در انتها به یک فرمت مربوط به فایلی تصویری ختم شده است (به فرض jpg، gif، png و...)، این قانون در مورد اکثر تصاویر موجود در وب صدق می کند (به جزء برخی که توسط کدهای سمت سرور یا کتابخانه های اسکریپتی تولید می شوند)؛ پس از به دست آوردن آدرس مستقیم عکس (برای اطمینان از صحیح بودن لینک، اگر آن را به صورت مستقیم در نوار آدرس مرورگر وارد کنید، تصویر نشان داده خواهد شد)، در قسمتی از مطالب (در ویرایشگر ارسال مطالب) که مایل هستید، کلیک کنید و آیکن ورود تصویر (معمولا به شکل یک منظره کوچک) را انتخاب نمائید.
web-blog-insert-image
در این قسمت، در فیلد url، آدرس کامل تصویر و در قسمت description و title توضیحات و عنوان تصویر را درج کنید (این تنظیمات ممکن است در سیستم های مختلف، اندکی متفاوت باشند)، اکنون تغییرات را تایید نمائید، اگر همه چیز را درست انجام داده باشید، تصویر مورد نظر را در ویرایشگر ارسال مطلب مشاهده خواهید کرد.

درج تصویر در وبلاگ از روی هارددیسک کامپیوتر


درج تصویر از روی هارددیسک کامپیوتر در وبلاگ و انتشار آن در وب با شیوه ای که در بالا توضیح داده شد تنها کمی فرق می کند؛ تفاوت این روش با کپی تصویر از صفحه ای در وب در این است که در اینجا باید عکس خود را ابتدا در وب بر روی سروری آپلود کنید (یعنی آن را به یک کامپیوتر متصل به شبکه جهانی انتقال دهید)؛ این کار معمولا از دو طریق امکان پذیر است؛ یک راه استفاده از سرور و فضای شخصی است و راه دوم استفاده از سرویس های رایگان آپلود تصاویر؛ در هر دو شیوه، فایل مورد نظر باید به سرور منتقل (آپلود) شود و سپس آدرس کامل آن در اختیار شما قرار گیرد (این آدرس در هاست شخصی با دنبال کردن دایرکتوری فایل و در سرویس دهنده های رایگان، معمولا توسط خود سرویس دهنده قابل دسترسی است)، از اینجا به بعد مراحل شبیه به آنچه پیشتر گفته شد می باشند، یعنی در قسمت ویرایشگر مطالب قسمت مربوط به ورود تصویر را انتخاب و پس از انجام تنظیمات لازم، آن را تایید می کنیم.

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


برای آنهایی که همیشه دوست دارند سر از زیر و بم چیزها در آورند، تکیه صرف بر سیستم مدیریت ویرایشگر مطالب وبلاگ معمولا قانع کننده نیست، از طرفی گاهی نیاز به اعمال تنظیمات بیشتر سبب می شود که دست به دامن کدهای html شویم، چرا که تصاویر، نهایتا به صورت این کدها در وب منتشر می شوند.
تگ اصلی که در html از آن برای درج تصویر استفاده می شود، img است، تگ img معمولا با عناصر alt، height، width، title و border کامل می شود، مثال زیر کد تصویری با ابعاد 200 در 200 پیکسل را با حاشیه صفر نشان می دهد (از حاشیه صفر، مخصوصا برای تصاویری که لینک شده اند استفاده کنید تا نوار آبی رنگ دور عکس حذف گردد، البته در نسخه html 5 باید از css برای این منظور استفاده شود).
<img src="http://yoursite.come/image/example.jpg" alt="image-in-blog" title="image-in-blog" border="0" height="200" width="200" />

نکاتی که در مورد درج تصاویر در وبلاگ، باید رعایت کنید


در پایان این آموزش، بد نیست نکات زیر را نیز به خاطر داشته باشید.
- از درج تصاویر خیلی حجیم (مثلا بیش از یک مگابایت) خودداری کنید، این نوع تصاویر علاوه بر اشغال میزان زیادی از فضای سرور، موجب بارگذاری طولانی مدت و به زحمت افتادن کاربران می شوند، بهتر است برای کاهش حجم تصاویر، از برنامه هایی مانند فتوشاپ استفاده کنید.
- از تغییر اندازه تصاویر اجتناب کنید، این کار موجب از فرم طبیعی خارج شدن آنها می شود، از طرفی از دید برخی موتورهای جستجوگر، موجب کاهش رتبه وبلاگ شما در هگام نمایش لیست جستجو خواهد شد.
- حتما برای تصاویر خود از تگ alt (متن جایگزین تصویر) و اندازه طول و عرض استفاده کنید، اهمیت این کار در کمک به استاندارد شدن کدنویسی صفحه و بالا رفتن اعتبار وبلاگ شما نزد موتورهای جستجو، نهفته است.
- از کپی تصاویر دیگران تا حد امکان پرهیز کنید، در صورت کپی برداری حتما لینک و نام سایت یا وبلاگ مبداء را ذکر نمائید.
- از به کار بردن تصاویر بیش از اندازه در یک صفحه خودداری کنید، این کار موجب بارگذاری سریع تر مطالبتان خواهد شد.
- تصاویر با پهنای پیکسلی بزرگتر از قالب خود در وبلاگ قرار ندهید، عدم توجه به این مسئله ممکن است سبب به هم ریختن قالب شود.
sectionدسته بندی: مهارتهای وب » وبلاگ نویسی
related مطالب بیشتر:
» آموزش نحوه قرار دادن کلیپ فلش در وبلاگ و سایت
» فوت و فن وبلاگ نویسی حرفه ای چیست؟!
» محافظت از مطالب وبلاگ در مقابل کپی غیر مجاز!
» نحوه قرار دادن فاوآیکن (favicon) در نوار آدرس وبلاگ و سایت
» پاسخ به سوالات و حل مشکلات وبلاگ نویسان
commentنظرات (۱۰۱ یادداشت برای این مطلب ارسال شده است)
نویسنده: هانیه
زمان: ۱۴:۴۸:۰۸ - تاریخ: ۱۳۹۱/۰۹/۰۸
سلام من جدیدا وبلاگ ساختم؛ برای درج تصویر همین کار رو انجام دادم؛ آدرس تصویر رو وارد کردم پیش نمایش که میزنم تصویر رو قشنگ نشون میده؛ ولی ثبت که میزنم هیچ اتفاقی نمیفته مشکل ازکجاست؟
جواب رو ایمیل کنید ممنون میشم
پاسخ: 
سلام
به احتمال زیاد مشکل از ناسازگاری ویرایشگر ارسال مطالب وبلاگ شما با مرورگری است که از آن استفاده می کنید، در مرورگرهای مختلف این کار را انجام دهید، اگر مشکل حل نشد این احتمال وجود دارد که ویرایشگر مطالب دچار مشکلی باشد که در این خصوص باید با پشتیبانی وبلاگ خود موضوع را مطرح کنید.
نویسنده: مهدی
زمان: ۱۲:۵۵:۰۶ - تاریخ: ۱۳۹۱/۰۹/۲۹
دستت درد نکنه
نویسنده: محمد
زمان: ۰۵:۰۶:۲۹ - تاریخ: ۱۳۹۱/۱۰/۰۵
سلام بر شما، من تصویری را روی وبلاگ خود قرار داده ام و می خواهم آن را پاک کنم اما نمی توانم، ممنون از لطف شما
پاسخ: 
سلام
از قسمت مدیریت مطالب قبلی وبلاگ، پست مورد نظر را انتخاب و آن را در محیط ویرایشگر باز کنید، تصویر شما در این قسمت مشخص و قابل حذف است، با این حال اگر قادر به این کار نیستند ممکن است مشکل از فعال نبودن جاوا اسکریپت یا ناسازگاری مرورگر با ویرایشگر بخش مدیریت وبلاگ باشد، از مرورگر دیگری استفاده کنید.
نویسنده: لالا
زمان: ۱۶:۳۱:۳۰ - تاریخ: ۱۳۹۱/۱۰/۲۹
حرف نداری
نویسنده: کیمیا
زمان: ۱۷:۳۰:۰۰ - تاریخ: ۱۳۹۱/۱۱/۱۱
سلام. من تمام این مراحل را انجام داده ام اما در نتیجه به جای تصویر ضربدر می اید و تصویر نمی اید ممنون میشم اگه جواب بدید.
پاسخ: 
سلام
عدم نمایش تصویر معمولا دو دلیل عمده دارد:
- مشکل در سرور تصویر یا حجم زیاد عکس.
- اشتباه در نحوه درج تصویر یا اشتباه در آدرس آن.
برای بررسی بیشتر آدرس تصویر را به صورت مستقیم در مرورگر وارد کنید، اگر تصویر ظاهر شد، پس اشکال از نحوه درج تصویر است.
نویسنده: ایمان
زمان: ۱۶:۰۳:۳۰ - تاریخ: ۱۳۹۱/۱۱/۲۷
با سلام
می خواستم بپرسم چجوری میشه یه عکس رو تو بلاگفا گذاشت با این شرط که یه لینک بهش بدم (یعنی زمانی که رو عکس کلیک بشه به یه صفحه جدید بشه رفت)
ممنون میشم راهنماییم کنید.
پاسخ: 
سلام
انجام این کار چندان سخت نیست، ابتدا روش درج تصویر معمولی را فرا بگیرید، سپس روی آن کلیک کنید و از گزینه های ویرایشگر ارسال مطلب، آیکن لینک (آیکن زنجیر مانند) را انتخاب و آدرس لینک را قرار دهید، روش دیگر، درج به صورت کد html است، به طور مثال:
<a href="http://www.yoursite.com" target="_blank"><img src="image/img.jpg" alt="متن جایگزین تصویر" height="100" width="200"></a>
نویسنده: MOHAMAD ALI NAZARI
زمان: ۱۰:۴۰:۰۶ - تاریخ: ۱۳۹۲/۰۲/۱۰
تصاویر چرا از قالب وبلاگ خارج میشه ؟
پاسخ: 
تصاویری که عرض آنها از عرض قسمت درج مطالب وبلاگ بیشتر باشد، به طور طبیعی از قالب وبلاگ خارج می شوند، راه حل این مشکل این است که یا عرض تصاویر را کوچکتر کنید یا قالب وبلاگتان را تغییر دهید.
نویسنده: سرنوشت
زمان: ۱۵:۴۱:۴۷ - تاریخ: ۱۳۹۲/۰۲/۱۵
سلام. من یه مشکل دارم که واقعا کلافه شدم. چطور میشه سایز عکس های بزرگ را تغییر داد تا از کادر بیرون نزنه؟
بعضی از دوستان کلیک روی عکس و کشیدن مربع های کوچک رو پیشنهاد دادند. ولی من هرچی کلیک می کنم هیچ مربعی ظاهر نمیشه.
خواهش می کنم کمکم کنید. (تغییر سایز عکس در فتوشاپ و... مورد نظر نیست)
پاسخ: 
سلام
در ویرایشگر ارسال مطالب (همان قسمتی که مطلب را نوشته و ارسال می کنید، با کلیک بر روی تصویر، به حالت انتخاب در می آید، سپس با کشیده مربع های کوچک در چهار طرف تصویر می توانید اندازه آن را کوچکتر کنید، البته این روش توصیه نمی شود و بهتر است از برنامه هایی مانند فتوشاپ و... استفاده کنید.
نویسنده: سرنوشت
زمان: ۱۵:۵۹:۴۳ - تاریخ: ۱۳۹۲/۰۲/۱۶
ممنون از راهنمایی شما
ولی من هرچی روی عکس کلیک میکنم به حالت انتخاب در نمیاد و مربع های کوچک ظاهر نمی شن
مشکل از کجاست؟
پاسخ: 
به احتمال زیاد مشکل از سازگار نبودن ویرایشگر ارسال مطلب با مرورگر شما است، از مرورگر دیگری استفاده کنید.
نویسنده: احمد
زمان: ۱۰:۱۱:۳۵ - تاریخ: ۱۳۹۲/۰۲/۲۲
سلام.
عالی بود ولی بهتره تصویری شم بزاری .
ممنونم از شما.
نویسنده: نسترن
زمان: ۱۱:۲۴:۰۴ - تاریخ: ۱۳۹۲/۰۲/۲۶
سلام.
از درج تصویر برای وارد کردن عکس استفاده میکنم اما وقتی میزنم پیش نمایش چیزی نشون نمیده !! چرا؟؟
پاسخ: 
سلام
اگر این مشکل تنها در قسمت پیش نمایش وجود دارد، ایراد از سرویس دهنده وبلاگ (میهن بلاگ) است، اما اگر این مشکل در وبلاگ نیز وجود دارد، ممکن است از سرور تصویر باشد (یعنی از سروری که تصویر در آن آپلود شده است) یا اینکه در درج تصویر اشتباهی صورت گرفته است.
نویسنده: نسترن
زمان: ۱۱:۵۸:۵۵ - تاریخ: ۱۳۹۲/۰۲/۲۶
اگه ایراد از میهن بلاگ باشه چه باید بکنم؟؟؟
پاسخ: 
از مرورگر دیگری استفاده کنید، اگر مشکل حل نشد، با اطمینان از سایر موارد می توانید به پشتیبانی آن اطلاع دهید.
نویسنده: نسترن
زمان: ۱۱:۳۶:۳۱ - تاریخ: ۱۳۹۲/۰۲/۳۰
سلام
من در بخش درج تصویر آدرس تصویر رو میذارم وقتی میزنم پیش نمایش چیزی نمیاد. ثبت را هم که میزنم اصلا تصویری درج نمیشه!
گفتید به پشتیبانی میهن بلاگ اطلاع بدم. چطوری؟ لطفا راهنماییم کنید.
پاسخ: 
سلام
از بخش تماس با ما که در صفحه اول میهن بلاگ در قسمت فوتر (پائین) قرار دارد استفاده کنید.
نویسنده: نسترن
زمان: ۰۹:۳۸:۵۲ - تاریخ: ۱۳۹۲/۰۳/۰۱
بازم سلام
به میهن بلاگ اطلاع دادم جواب داد که آدرس تصویر رو در قسمت ارسال مطالب وارد کن.
این کار رو هم کردم اما باز تصویر درج نشد
دوباره بهش پیام دادم جواب نداد
کلافه شدم. چه کنم؟
پاسخ: 
سلام
آدرس تصویر را به طور مستقیم در نوار آدرس مرورگر وارد و دکمه Enter را بزنید، اگر تصویر نمایش داده نشد، پس ایراد از آدرس یا سرور آن است، اما اگر تصویر نمایش داده شد، ممکن است ایراد از مرورگر و فعال نبودن به فرض جاوا اسکریپت در آن باشد، از یک مرورگر دیگر استفاده کنید، اگر با این حال مشکل حل نشد، لطفا آدرس تصویر را درج کنید تا بیشتر بررسی شود.
نویسنده: نسترن
زمان: ۱۰:۱۵:۰۸ - تاریخ: ۱۳۹۲/۰۳/۰۱
برای اینکه با کدنویسی درج تصویر کنم چه کنم؟ میخوام داخل یه پستی تصویر بذارم کجای کد html باید کد مربوط به درج تصویر رو وارد کنم؟
پاسخ: 
هر کجا که مناسب بود! وقتی سورس کدها را نگاه می کنید، در کنار کدها، مطالب نیز مشخص هستند، در کنار مطلب مورد نظر وارد کنید، برای ایجاد خط جدید هم می توانید از تگ
<br>
استفاده کنید.
paged صفحه 1 از 7




more لطفا دقت کنید که یادداشت های زیر منتشر نشده و حذف خواهند شد:
- یادداشت های خارج از موضوع این مطلب.
- سوالات کلی، غیر ضروری و مشکلاتی که هیچ تلاشی برای رفع آن نکرده باشید.
- نظرات حاوی کدها و اسکریپت های خیلی طولانی (به طور مثال کد کامل قالب وبلاگ).

9 × 6
 refresh
آگهی
seonab.com
طراحی نرم افزار اندروید
رنگین کمان عکس
Ranginkamaan.com

آرشیو عکس های باکیفیت با موضوعات متنوع...