-
خانهخانه
-
مقالاتمقالات
-
فروشگاهفروشگاه
-
طراحی سایتطراحی سایت
-
درباره مادرباره ما
-
حمایت از ماحمایت از ما
-
ارتباط با ماارتباط با ما
اگر این مقاله را دوست دارید، لطفا آن را با دوستان خود به اشتراک بگذارید.
من سال‌ها پیش برای اولین بار با پاورقی‌ها در نرم‌افزار ورد (آفیس) روبرو شدم، و از آن زمان رفته رفته آنها را در وب‌سایت‌های متعددی هم دیدم. در ابتدا موضوع پاوری در وب‌سایت‌ها چیز جدیدی بود که هرگز به آن نیاز نداشتم. اما بعد که واقعا شروع کردم به نوشتن …
به عنوان یک نویسنده، پاورقی‌ها گاهی اوقات بسیار مفید هستند. با این حال، به عنوان کسی که تازه شروع به یادگیری نحوه عملکرد زبان HTML کرده است، زمان زیادی طول کشید، چندین سؤال از موتورهای جستجو و تعداد انگشت شماری از وب‌سایت‌ها برای فهمیدن نحوه کارکرد پاورقی‌ها صرف کردم.
به هر حال، از پاورقی شما می‌توانید در بلاگر، وردپرس یا هر سیستم وبلاگ‌نویسی دیگری که HTML را می‌پذیرد استفاده کنید.
از آنجایی که هیچ راهی برای ایجاد پاورقی در ویرایشگر «Compose» یا «WYSIWIG» بلاگر (و اکثر پلتفرم‌های دیگر) وجود ندارد، تنها راه برای انجام آن نوشتن کد HTML است.
بسیاری به خواندن نحوه‌ی کار آن اهمیتی نمی‌دهند، بنابراین کدی که برای پاورقی‌ها در وبسایت خودم استفاده می‌کنم در اینجا آورده‌ام:
|
|
که در مرورگر شما به این شکل به تصویر در خواهد آمد:
مقداری متن همراه با پاورقی.۱
چند متن دیگر همراه با پاورقی.۲
چند متن دیگر همراه با پاورقی.۳
چند متن دیگر همراه با پاورقی.۴
۱. [متن پانوشت ۱]↩
۲. [متن پاورقی ۲]↩
۳. [متن پاورقی ۳]↩
۴. [متن پانوشت ۴]↩
شما می‌توانید این صفحه را نشانه‌گذاری کنید، و مستقیماً از کد بالایی برای بقیه‌ی پاورقی‌ها کپی کنید، یا آن را کپی کرده و در یک فایل متنی برای مراجعات بعدی ذخیره کنید.
تذکر: شما نمی‌توانید از آن با ویرایشگر WISYWIG (Compose) بلاگر استفاده کنید. بلکه باید از ویرایشگر HTML استفاده کنید. اگر ویرایشگر به WISYWIG (Compose) تغییر کند، بخشی از کد را جایگزین می‌کند و عملکرد را غیرفعال خواهد نمود. البته در خصوص سایر ویرایشگرها و نحوه برخوردشان با این کدها اطلاع و نظری ندارم.
البته ویرایشگر کلاسیک، ویرایشگر پیشرفته (TinyMCE Advanced) و المان‌های html در المنتور هم هیچ مشکلی با این کد ندارند. پس شما می‌توانید در وردپرس به راحتی از این استفاده کنید.
اما اگر ویرایشگر خود را به برگه “Compose” در بلاگر تغییر داده‌اید، به ویرایشگر HTML بروید و نشانی اینترنتی را که جایگزین <a href=”#ref4″> یا <a href=”#fn1″> شده است حذف کنید.
برای یک پاورقی مناسب، عدد (یا حرف) باید به صورت بالانویس (کوچک‌تر و بالاتر از سایر نویسه‌ها) باشد. برای اینکه به پایین اسکرول شود، جایی که یادداشت وجود دارد، باید یک پیوند باشد. یادداشت پایین نیز باید پیوندی به متن یادداشت شده در متن اثر داشته باشد. در اینجا برچسب‌های استفاده شده و هدف آنها آمده است (به یاد داشته باشید که برچسب‌ها را با استفاده از “/” در همان برچسبی که با آن باز می‌کنید ببندید.):
امیدوارم که این برای کسانی که به دنبال راهی برای ایجاد پاورقی در HTML هستند مفید باشد. اگر این را با موفقیت امتحان کردید، لطفاً به من اطلاع دهید. اگر مشکلی داشتید، خوشحال می‌شوم تا بتوانم تمام تلاشم را بکنم تا کمک کنم.
تذکر: به منظور جلوگیری از بروز نقص در کدِ فوق، بهتر آن است که از کپی‌برداری اجتناب کرده و نسبت به تایپ آن اقدام کنید تا مواردی همچون گیومه‌ها و … به درستی ثبت شوند.
بخوانید: تغییر ویژگی رنگ تگ hr در html
اگر این مقاله را دوست دارید، لطفا آن را با دوستان خود به اشتراک بگذارید.
![دانلود کتاب: فضای مجازی و سلامت روانی [راهکارهای بهبود روانشناختی در دنیای آنلاین]](https://ivsi.ir/wp-content/uploads/2023/05/virtual-space-and-mental-health-book-300x300.webp)
3 پاسخ
سلام علیکم؛ جناب آقای اکبری.
ممنون از اشتراک کد.
چون بعضی کتاب‌های درسی را در html حاشیه می‌زنم و ثبت می‌کنم. و مدام باید این کد را وارد کنم. چه خوب میشه اگر بفهمم: از چه راهی می‌توان إعمال id ها و ترتیب پاورقی‌ها را خودکار کرد؟ ذهن خودم میره سمت js.
از خود html که چنین کاری بر نمی‌اید. من با ویرایشگر gedit کار کردم. یه راهی که جلوم گذاشت این بود که در بخش snippet همین کدی که بارها تکرارش می کنم را بنویسم اما با این مزیت که جای آن بخش‌های متغیر، $ باشه، تا موقع استفاده با کلید tab، بین همان‌ها جابجا شوم و رقمی که نیاز هست را بنویسم. (اما چند تا اعصاب خوردی داره لذا دنبال چاره‌ام. احتمالا چون با ویندوز استفاده می‌کنم اینطوره.)
یا از نرم افزار sigil استفاده کردم. کار مشابهی انجام می‌دهد. ولی سوال و نیاز اصلی‌م همین هست که بتونم جدای از این ثوابت و استخوان بندی، متغیرهایی را تعریف کنم تا کارم سریع‌تر پیش بره.
ممنون میشم چیزی که بنظرتون میرسه را برام ارسال بفرمایید.
سلام
من تا حالا نیازمند چنین مسئله ای در کدنویسی (خاصتا در html) نبودم و لذا موقتا نمی تونم راهنمایی قطعی بهتون ارائه بدم (می تونم براتون بررسی کنم، و البته می شه کمی صبر کنیم تا سایر نویسندگان ایوسی اظهارنظر کنن)
البته همون طور خودِ شما هم اشاره کردی، این فقره بدون کمک گرفته از javascript یا jquery محقق نمی شه
اما اگه خودم بخوام این مسئله رو با راهکاری ساده به نتیجه برسونم، بجای استفاده از ادیتورهای متن و کد مرسوم استفاده کنم، از نرم افزار Microsoft word استفاده می کنم (قعدتا می دونین این خواسته شما در این نرم افزار به راحتی امکان پذیره)
بعد یا خروجی html می گیرم (به جای خروجی doc یا docx) که قاعدتا می شه از کد خروجی به راحتی استفاده کرد (هر چند اضافاتی هم داره). یا متن نهایی رو با استایلش کپی می کنم (با یه Ctrl+C) و توی یه ایدیتور آنلاین مثل TinyMCE جایگذاری می کنم (با یه Ctrl+V) و خروجی html رو به راحتی و به سرعت برمی دارم ….
این راهکاری ساده هست که برای امور تکرار شونده ی طولانی در html می تونه خیلی موثر باشه (مثل همین مورد شما) و نیاز به کد نویسی رو هم بسیار کاهش می ده
البته این رو هم بگم که برای ساخت کتاب الکترونیکی، نرم افزارهای آنلاین و آفلاین زیادی وجود داره که کلا می تونه شما رو کدنویسی بی نیاز بکنن و سرعت شما رو هم بسیار بالاتر ببرن؛ مثلا:
Microsoft Word – که اشاره شد
Apple Pages
Google Docs
Canva
Kindle Create
Kindle Previewer
Calibre
Sonar
Book Description Generator
Free 3D book covers
Kitaboo
Epubeemaker
Flipbuilder
Blurb
Pressbooks
FlipHTML5
Mobipocket
Vellum
Kotobee
Scrivener
و …