├── screenshots ├── home.png ├── donate.png ├── gallery.png ├── podcast.png ├── article-list.png ├── about-timeline.png └── article-detail.png ├── html ├── assets │ ├── media │ │ ├── beep.mp3 │ │ └── sample_video.mp4 │ └── style.css ├── layout │ ├── inc_date_time_info.html │ ├── inc_pagination.html │ ├── _layout_error.html │ └── _layout.html ├── error_404.html ├── error_503.html ├── error_500.html ├── donate.html ├── contact.html ├── page.html ├── gallery.html ├── faq.html ├── about.html ├── index.html ├── podcast-single.html ├── podcast-list.html ├── article-list.html ├── about-timeline.html └── article-single.html ├── pug ├── layout │ ├── inc_date_time_info.pug │ ├── inc_pagination.pug │ ├── _layout_error.pug │ └── _layout.pug ├── error_404.pug ├── gallery.pug ├── error_503.pug ├── error_500.pug ├── donate.pug ├── contact.pug ├── page.pug ├── faq.pug ├── about.pug ├── index.pug ├── article-list.pug ├── about-timeline.pug ├── podcast-single.pug ├── podcast-list.pug └── article-single.pug ├── .github └── FUNDING.yml └── README.md /screenshots/home.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miladnouri/Simple-blog-template/HEAD/screenshots/home.png -------------------------------------------------------------------------------- /screenshots/donate.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miladnouri/Simple-blog-template/HEAD/screenshots/donate.png -------------------------------------------------------------------------------- /screenshots/gallery.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miladnouri/Simple-blog-template/HEAD/screenshots/gallery.png -------------------------------------------------------------------------------- /screenshots/podcast.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miladnouri/Simple-blog-template/HEAD/screenshots/podcast.png -------------------------------------------------------------------------------- /html/assets/media/beep.mp3: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miladnouri/Simple-blog-template/HEAD/html/assets/media/beep.mp3 -------------------------------------------------------------------------------- /screenshots/article-list.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miladnouri/Simple-blog-template/HEAD/screenshots/article-list.png -------------------------------------------------------------------------------- /screenshots/about-timeline.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miladnouri/Simple-blog-template/HEAD/screenshots/about-timeline.png -------------------------------------------------------------------------------- /screenshots/article-detail.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miladnouri/Simple-blog-template/HEAD/screenshots/article-detail.png -------------------------------------------------------------------------------- /html/assets/media/sample_video.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miladnouri/Simple-blog-template/HEAD/html/assets/media/sample_video.mp4 -------------------------------------------------------------------------------- /pug/layout/inc_date_time_info.pug: -------------------------------------------------------------------------------- 1 | // Date/Time & Comments Count Info 2 | p.article-info تاریخ انتشار: ۱۹ اسفند ۱۴۰۲ | ساعت ۳:۵۵ ب.ظ | ۱۷ نظر 3 | 4 | -------------------------------------------------------------------------------- /html/layout/inc_date_time_info.html: -------------------------------------------------------------------------------- 1 | 2 | 3 |

تاریخ انتشار: ۱۹ اسفند ۱۴۰۲ | ساعت ۳:۵۵ ب.ظ | ۱۷ نظر

-------------------------------------------------------------------------------- /pug/layout/inc_pagination.pug: -------------------------------------------------------------------------------- 1 | // Pagination row 2 | div.pagination 3 | a.page-link(href='#') قبلی 4 | a.page-link.active(href='#') 1 5 | a.page-link(href='#') 2 6 | | ... 7 | a.page-link(href='#') 23 8 | a.page-link(href='#') 24 9 | a.page-link(href='#') بعدی -------------------------------------------------------------------------------- /html/layout/inc_pagination.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | -------------------------------------------------------------------------------- /pug/error_404.pug: -------------------------------------------------------------------------------- 1 | extends layout/_layout_error 2 | 3 | block variables 4 | - var title = "خطای ۴۰۴ - صفحه پیدا نشد" 5 | - var subTitle = "متأسفیم، صفحه‌ای که دنبال آن هستید پیدا نشد." 6 | 7 | block content 8 | 9 | // 404 Error Page Content 10 | svg(width="200", height="200", viewBox="0 0 24 24", fill="none", xmlns="http://www.w3.org/2000/svg") 11 | circle(cx="12", cy="12", r="10", fill="#333333") 12 | circle(cx="12", cy="12", r="6", fill="#FFFFFF") 13 | circle(cx="12", cy="12", r="2", fill="#333333") 14 | 15 | -------------------------------------------------------------------------------- /html/layout/_layout_error.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 |

16 |

بازگشت به صفحه اصلی 17 |
18 | 19 | -------------------------------------------------------------------------------- /pug/layout/_layout_error.pug: -------------------------------------------------------------------------------- 1 | block variables 2 | 3 | doctype html 4 | html(lang="fa" dir="rtl") 5 | head 6 | // Document metadata 7 | meta(charset="UTF-8") 8 | meta(name="viewport", content="width=device-width, initial-scale=1.0") 9 | title #{title} 10 | meta(name='description', content=title) 11 | 12 | // External stylesheet 13 | link(rel="stylesheet", href="assets/style.css") 14 | body 15 | // Error Page Content 16 | main.error 17 | block content 18 | 19 | h1 #{title} 20 | p #{subTitle} 21 | a(href="index.html") بازگشت به صفحه اصلی -------------------------------------------------------------------------------- /pug/gallery.pug: -------------------------------------------------------------------------------- 1 | extends layout/_layout 2 | 3 | block variables 4 | - var pageTitle = "گالری" 5 | 6 | block content 7 | 8 | 9 | section.card 10 | 11 | h2 گالری (مثلا لیست مصاحبه‌ها) 12 | 13 | .gallery 14 | 15 | //- Gallery Photos 16 | - for (var i = 1; i <= 6; i++) 17 | div.photo 18 | a(href="#" target="_blank") 19 | img(src=`https://fakeimg.pl/800x600/${i % 2 === 0 ? 'eb4034' : '5469a1'}/ffffff?text=Photo+${i}`, alt=`تصویر ${i}`) 20 | div.caption 21 | h3= `عنوان تصویر ${i}` 22 | p= `۲۲ مهر ۱۴۰۲` 23 | -------------------------------------------------------------------------------- /.github/FUNDING.yml: -------------------------------------------------------------------------------- 1 | # These are supported funding model platforms 2 | 3 | github: # Replace with up to 4 GitHub Sponsors-enabled usernames e.g., [user1, user2] 4 | patreon: # Replace with a single Patreon username 5 | open_collective: # Replace with a single Open Collective username 6 | ko_fi: # Replace with a single Ko-fi username 7 | tidelift: # Replace with a single Tidelift platform-name/package-name e.g., npm/babel 8 | community_bridge: # Replace with a single Community Bridge project-name e.g., cloud-foundry 9 | liberapay: # Replace with a single Liberapay username 10 | issuehunt: # Replace with a single IssueHunt username 11 | lfx_crowdfunding: # Replace with a single LFX Crowdfunding project-name e.g., cloud-foundry 12 | polar: # Replace with a single Polar username 13 | buy_me_a_coffee: miladnu 14 | thanks_dev: # Replace with a single thanks.dev username 15 | custom: ['https://milad.nu/page/donate', 'https://paypal.me/miladnu'] 16 | -------------------------------------------------------------------------------- /pug/error_503.pug: -------------------------------------------------------------------------------- 1 | extends layout/_layout_error 2 | 3 | block variables 4 | - var title = "خطای ۵۰۳ - سرویس در دسترس نیست" 5 | - var subTitle = "متأسفیم، در حال حاضر سرویس مورد نظر در دسترس نمی‌باشد." 6 | 7 | block content 8 | 9 | // 500 Error Page Content 10 | svg(width="200", height="200", viewBox="0 0 24 24", fill="none", xmlns="http://www.w3.org/2000/svg") 11 | path(d="M12 2C6.477 2 2 6.477 2 12C2 17.523 6.477 22 12 22C17.523 22 22 17.523 22 12C22 6.477 17.523 2 12 2ZM14.293 16.293C13.902 16.684 13.268 16.684 12.877 16.293L12 15.414L11.123 16.293C10.732 16.684 10.098 16.684 9.707 16.293C9.316 15.902 9.316 15.268 9.707 14.877L10.586 14L9.707 13.121C9.316 12.73 9.316 12.096 9.707 11.705C10.098 11.314 10.732 11.314 11.123 11.705L12 12.586L12.877 11.707C13.268 11.316 13.902 11.316 14.293 11.707C14.684 12.098 14.684 12.732 14.293 13.123L13.414 14L14.293 14.877C14.684 15.268 14.684 15.902 14.293 16.293Z", fill="#333333") -------------------------------------------------------------------------------- /pug/error_500.pug: -------------------------------------------------------------------------------- 1 | extends layout/_layout_error 2 | 3 | block variables 4 | - var title = "خطای ۵۰۰ - خطای داخلی سرور" 5 | - var subTitle = "متأسفیم، در حال حاضر خطایی در سرور رخ داده است. لطفاً بعداً دوباره امتحان کنید یا با پشتیبانی تماس بگیرید." 6 | 7 | block content 8 | 9 | // 500 Error Page Content 10 | svg(width="200", height="200", viewBox="0 0 24 24", fill="none", xmlns="http://www.w3.org/2000/svg") 11 | path(d="M12 1.667C6.267 1.667 1.667 6.267 1.667 12C1.667 17.733 6.267 22.333 12 22.333C17.733 22.333 22.333 17.733 22.333 12C22.333 6.267 17.733 1.667 12 1.667ZM12 20.333C7.167 20.333 3.667 16.833 3.667 12C3.667 7.167 7.167 3.667 12 3.667C16.833 3.667 20.333 7.167 20.333 12C20.333 16.833 16.833 20.333 12 20.333ZM12 7.333C10.9 7.333 10 8.233 10 9.333C10 10.433 10.9 11.333 12 11.333C13.1 11.333 14 10.433 14 9.333C14 8.233 13.1 7.333 12 7.333ZM12 15.667C11.067 15.667 10.333 16.4 10.333 17.333C10.333 18.267 11.067 19 12 19C12.933 19 13.667 18.267 13.667 17.333C13.667 16.4 12.933 15.667 12 15.667Z", fill="#333333") -------------------------------------------------------------------------------- /html/error_404.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | خطای ۴۰۴ - صفحه پیدا نشد 8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |

خطای ۴۰۴ - صفحه پیدا نشد

22 |

متأسفیم، صفحه‌ای که دنبال آن هستید پیدا نشد.

بازگشت به صفحه اصلی 23 |
24 | 25 | -------------------------------------------------------------------------------- /pug/donate.pug: -------------------------------------------------------------------------------- 1 | extends layout/_layout 2 | 3 | block variables 4 | - var pageTitle = "حمایت مالی" 5 | 6 | block content 7 | 8 | 9 | // Breadcrumb navigation 10 | div.breadcrumb 11 | a(href="index.html") خانه 12 | | > 13 | | حمایت مالی 14 | 15 | 16 | section.card.donation 17 | h2 حمایت مالی (نمونه ۱) 18 | p 19 | | اگر از محتوای وبلاگ ما لذت می‌برید و می‌خواهید ما را حمایت کنید، می‌توانید با کلیک بر روی دکمه زیر اقدام به اهدای مبلغ دلخواه خود کنید. هر یک از حمایت‌های شما، به ما در ادامه تولید محتوا کمک می‌کند. 20 | .donation-buttons 21 | a.donation-button.paypal(href='#') حمایت با PayPal 22 | a.donation-button.bitcoin(href='#') حمایت با Bitcoin 23 | a.donation-button.ethereum(href='#') حمایت با Ethereum 24 | a.donation-button.dogecoin(href='#') حمایت با Dogecoin 25 | 26 | section.card.donation 27 | h2 حمایت مالی (نمونه ۲) 28 | p 29 | | اگر از محتوای وبلاگ ما لذت می‌برید و می‌خواهید ما را حمایت کنید، می‌توانید با کلیک بر روی دکمه زیر اقدام به اهدای مبلغ دلخواه خود کنید. هر یک از حمایت‌های شما، به ما در ادامه تولید محتوا کمک می‌کند. 30 | button.donation-button لینک حمایت مالی 31 | -------------------------------------------------------------------------------- /pug/contact.pug: -------------------------------------------------------------------------------- 1 | extends layout/_layout 2 | 3 | block variables 4 | - var pageTitle = "تماس با من" 5 | 6 | block content 7 | 8 | // Breadcrumb navigation 9 | div.breadcrumb 10 | a(href="index.html") خانه 11 | | > 12 | | تماس با من 13 | 14 | section.card 15 | h2 تماس با من 16 | p 17 | | برای ارتباط با من، لطفاً فرم زیر را پر کنید یا از اطلاعات تماس پایین استفاده کنید. 18 | 19 | .contact-info 20 | p 21 | strong آدرس ایمیل: 22 | span.email info@example.com 23 | p 24 | strong تلفن: 25 | | 123-456-7890 26 | p 27 | strong آدرس: 28 | | تهران، خیابان مثال، کوچه تست، پلاک 123 29 | 30 | form.contact-form(action="submit_contact_form.php" method="post") 31 | label(for="name") نام: 32 | input#name(type="text" name="name" required) 33 | 34 | label(for="email") ایمیل: 35 | input#email(type="email" name="email" required) 36 | 37 | label(for="message") پیام: 38 | textarea#message(name="message" rows="4" required) 39 | 40 | button(type="submit") ارسال پیام -------------------------------------------------------------------------------- /pug/page.pug: -------------------------------------------------------------------------------- 1 | extends layout/_layout 2 | 3 | block variables 4 | - var pageTitle = "صفحه متنی" 5 | 6 | block content 7 | section.card 8 | h2 قوانین و مقررات 9 | .about-text 10 | p 11 | | این یک وبلاگ است که به مقالات و مطالب مرتبط با برنامه‌نویسی و تکنولوژی می‌پردازد. ما سعی داریم 12 | | اطلاعات مفید و کاربردی را در اختیار کاربران علاقه‌مند به این حوزه قرار دهیم. امیدواریم که 13 | | از مطالب ما لذت ببرید و مفید بدانید. این وبلاگ با هدف ارتقاء دانش و آموزش جامعه برنامه‌نویسی و 14 | | مهندسان نرم‌افزار تأسیس شده است. در اینجا سعی می‌کنیم به صورت مرتب و منظم، مطالبی را منتشر 15 | | کنیم که به کاربران علاقه‌مند در این زمینه‌ها کمک کند و آن‌ها را با تازه‌ترین دانش‌ها و 16 | | تکنولوژی‌ها آشنا سازد. هدف ما ایجاد یک محتوای آموزشی، جذاب و مفید است که بتواند در حل مشکلات و 17 | | چالش‌های برنامه‌نویسی و تکنولوژی کاربران مؤثر باشد. 18 | p 19 | | برنامه‌نویسی یکی از حوزه‌های پرکاربرد و مهم دنیای فناوری اطلاعات است که انواع زبان‌ها و 20 | | تکنولوژی‌های مختلفی دارد. با پیشرفت تکنولوژی‌ها و نیازهای روزافزون بازار کار، به‌روز بودن با 21 | | آخرین تحولات برنامه‌نویسی ضروری است. این وبلاگ در جهت ارتقاء دانش کاربران و آشنایی آن‌ها با 22 | | تکنولوژی‌ها و الگوهای طراحی مختلف تأسیس شده است. 23 | 24 | p.article-info بروزرسانی: ۱۸ بهمن ۱۴۰۰ | ساعت ۴:۱۰ ب.ظ 25 | -------------------------------------------------------------------------------- /html/error_503.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | خطای ۵۰۳ - سرویس در دسترس نیست 8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 |

خطای ۵۰۳ - سرویس در دسترس نیست

20 |

متأسفیم، در حال حاضر سرویس مورد نظر در دسترس نمی‌باشد.

بازگشت به صفحه اصلی 21 |
22 | 23 | -------------------------------------------------------------------------------- /html/error_500.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | خطای ۵۰۰ - خطای داخلی سرور 8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 |

خطای ۵۰۰ - خطای داخلی سرور

20 |

متأسفیم، در حال حاضر خطایی در سرور رخ داده است. لطفاً بعداً دوباره امتحان کنید یا با پشتیبانی تماس بگیرید.

بازگشت به صفحه اصلی 21 |
22 | 23 | -------------------------------------------------------------------------------- /pug/faq.pug: -------------------------------------------------------------------------------- 1 | extends layout/_layout 2 | 3 | block variables 4 | - var pageTitle = "سوال‌های متداول" 5 | 6 | block content 7 | 8 | section.card 9 | h1 سوال‌های متداول درباره خدمات شرکت برنامه‌نویسی 10 | 11 | .faq-item 12 | h4.question چه خدماتی توسط این شرکت برنامه‌نویسی ارائه می‌شود؟ 13 | .answer 14 | p 15 | | شرکت ما در زمینه توسعه نرم‌افزار، طراحی وب، تست کیفیت و مشاوره فنی فعالیت می‌کند. ما انواع نرم‌افزارهای تجاری و سفارشی را بر اساس نیازهای شما توسعه می‌دهیم. 16 | 17 | .faq-item 18 | h4.question آیا می‌توانید به طراحی و توسعه وبسایت‌های پویا پرداخت؟ 19 | .answer 20 | p 21 | | بله، ما تجربه طراحی و توسعه وبسایت‌های پویا را داریم. ما از تکنولوژی‌های مدرن مانند React و Vue.js برای ساخت وبسایت‌های پویا استفاده می‌کنیم. 22 | 23 | .faq-item 24 | h4.question آیا خدمات شما شامل تست و اعتبارسنجی نرم‌افزارها نیز می‌شود؟ 25 | .answer 26 | p 27 | | بله، تست کیفیت و اعتبارسنجی نرم‌افزارها نیز جزو خدمات ما می‌باشد. ما از روش‌ها و ابزارهای مدرن برای اطمینان از کارکرد صحیح نرم‌افزارها استفاده می‌کنیم. 28 | 29 | .faq-item 30 | h4.question آیا مشاوره فنی در زمینه تکنولوژی‌های جدید نیز ارائه می‌شود؟ 31 | .answer 32 | p 33 | | بله، ما به عنوان متخصصان در حوزه فناوری اطلاعات، مشاوره فنی در زمینه تکنولوژی‌های جدید و روندهای بازار را ارائه می‌دهیم تا بهترین تصمیمات را برای پروژه‌های شما بگیرید. 34 | 35 | .faq-item 36 | h4.question آیا قادر به ارائه نرم‌افزارهای مخصوص صنایع خاص هستید؟ 37 | .answer 38 | p 39 | | بله، ما توانایی توسعه نرم‌افزارهای مخصوص به صنایع خاص را داریم. بسته به نیازها و مشخصات فنی، نرم‌افزارهایی را برای صنایع مانند بهداشت، مالی، و تولید توسعه می‌دهیم. 40 | 41 | .faq-item 42 | h4.question آیا پشتیبانی و تعمیرات نیز از خدمات شما است؟ 43 | .answer 44 | p 45 | | بله، پس از تحویل پروژه، ما پشتیبانی و تعمیرات لازم را ارائه می‌دهیم تا مطمئن شوید که نرم‌افزارها به درستی کار می‌کنند و در صورت نیاز به به‌روزرسانی‌ها و تغییرات، آماده‌ایم. 46 | 47 | // Add more FAQ items as needed 48 | 49 | script. 50 | document.addEventListener("DOMContentLoaded", function() { 51 | const questions = document.querySelectorAll(".question"); 52 | questions.forEach(question => { 53 | question.addEventListener("click", function() { 54 | this.classList.toggle("active"); 55 | }); 56 | }); 57 | }) -------------------------------------------------------------------------------- /pug/about.pug: -------------------------------------------------------------------------------- 1 | extends layout/_layout 2 | 3 | block variables 4 | - var pageTitle = "درباره من" 5 | 6 | block content 7 | 8 | 9 | // Breadcrumb navigation 10 | div.breadcrumb 11 | a(href="index.html") خانه 12 | | > 13 | | درباره من 14 | 15 | section.card 16 | h2 درباره من 17 | .about-text 18 | p 19 | img.about-photo(src='https://via.placeholder.com/200', alt='تصویر نمایه') 20 | | این یک وبلاگ است که به مقالات و مطالب مرتبط با برنامه‌نویسی و تکنولوژی می‌پردازد. ما سعی داریم 21 | | اطلاعات مفید و کاربردی را در اختیار کاربران علاقه‌مند به این حوزه قرار دهیم. امیدواریم که 22 | | از مطالب ما لذت ببرید و مفید بدانید. این وبلاگ با هدف ارتقاء دانش و آموزش جامعه برنامه‌نویسی و 23 | | مهندسان نرم‌افزار تأسیس شده است. در اینجا سعی می‌کنیم به صورت مرتب و منظم، مطالبی را منتشر 24 | | کنیم که به کاربران علاقه‌مند در این زمینه‌ها کمک کند و آن‌ها را با تازه‌ترین دانش‌ها و 25 | | تکنولوژی‌ها آشنا سازد. هدف ما ایجاد یک محتوای آموزشی، جذاب و مفید است که بتواند در حل مشکلات و 26 | | چالش‌های برنامه‌نویسی و تکنولوژی کاربران مؤثر باشد. 27 | p 28 | | برنامه‌نویسی یکی از حوزه‌های پرکاربرد و مهم دنیای فناوری اطلاعات است که انواع زبان‌ها و 29 | | تکنولوژی‌های مختلفی دارد. با پیشرفت تکنولوژی‌ها و نیازهای روزافزون بازار کار، به‌روز بودن با 30 | | آخرین تحولات برنامه‌نویسی ضروری است. این وبلاگ در جهت ارتقاء دانش کاربران و آشنایی آن‌ها با 31 | | تکنولوژی‌ها و الگوهای طراحی مختلف تأسیس شده است. 32 | p 33 | | موضوعاتی که در این وبلاگ پوشش داده می‌شود شامل برنامه‌نویسی وب، برنامه‌نویسی موبایل، اپلیکیشن‌های 34 | | تحت وب، برنامه‌نویسی سمت سرور، امنیت و نگهداری سایت‌ها، طراحی واسط کاربری (UI/UX)، داده‌ها و 35 | | بانک‌های اطلاعاتی، چشم‌انداز این حوزه و تحلیل انتخاب رشته در دانشگاه‌ها می‌باشد. ما به دنبال 36 | | به‌روزرسانی دائمی مطالب و انتشار محتواهای مفید و کاربردی در این زمینه‌ها هستیم. 37 | 38 | a.donation-button(href='about-timeline.html') تاریخچه فعالیت‌های من 39 | p.article-info بروزرسانی: ۱۸ بهمن ۱۴۰۰ | ساعت ۴:۱۰ ب.ظ 40 | 41 | section.card.donation 42 | h2 حمایت مالی (نمونه ۱) 43 | p 44 | | اگر از محتوای وبلاگ ما لذت می‌برید و می‌خواهید ما را حمایت کنید، می‌توانید با کلیک بر روی دکمه زیر اقدام به اهدای مبلغ دلخواه خود کنید. هر یک از حمایت‌های شما، به ما در ادامه تولید محتوا کمک می‌کند. 45 | .donation-buttons 46 | a.donation-button.paypal(href='donate.html') حمایت با PayPal 47 | a.donation-button.bitcoin(href='donate.html') حمایت با Bitcoin 48 | a.donation-button.ethereum(href='donate.html') حمایت با Ethereum 49 | a.donation-button.dogecoin(href='donate.html') حمایت با Dogecoin 50 | 51 | section.card.donation 52 | h2 حمایت مالی (نمونه ۲) 53 | p 54 | | اگر از محتوای وبلاگ ما لذت می‌برید و می‌خواهید ما را حمایت کنید، می‌توانید با کلیک بر روی دکمه زیر اقدام به اهدای مبلغ دلخواه خود کنید. هر یک از حمایت‌های شما، به ما در ادامه تولید محتوا کمک می‌کند. 55 | a.donation-button(href='donate.html') لینک حمایت مالی -------------------------------------------------------------------------------- /pug/index.pug: -------------------------------------------------------------------------------- 1 | extends layout/_layout 2 | 3 | block variables 4 | - var pageTitle = "صفحه اصلی" 5 | 6 | block content 7 | article.card 8 | // Article 1 9 | div.gray-badge نمونه بج طوسی 10 | h2: a(href='article-single.html') چگونگی بهینه‌سازی وب‌سایت 11 | img(src='https://fakeimg.pl/800x300/5469a1/ffffff?text=Sample+image&font=lobster', alt='تصویر مقاله') 12 | p در این مقاله به بررسی روش‌های بهینه‌سازی وب‌سایت برای سرعت بیشتر، افزایش رتبه در نتایج جستجوی گوگل و بهبود تجربه کاربری پرداخته می‌شود. 13 | 14 | //- Date/Time & Comments Count Info 15 | include layout/inc_date_time_info.pug 16 | 17 | article.card 18 | // Article 2 19 | div.red-badge نمونه بج قرمز 20 | h2: a(href='article-single.html') راهکارهایی برای بهبود امنیت شبکه 21 | p در این مقاله به بررسی راهکارهای مختلفی برای بهبود امنیت شبکه از جمله استفاده از فایروال، ابزارهای تشخیص تهدیدات، و کنترل دسترسی کاربران پرداخته می‌شود. 22 | 23 | //- Date/Time & Comments Count Info 24 | include layout/inc_date_time_info.pug 25 | 26 | article.card 27 | // Article 3 28 | h2: a(href='article-single.html') چگونگی کاهش هزینه‌های سرور با استفاده از تجزیه و تحلیل داده‌ها 29 | p در این مقاله به بررسی نحوه استفاده از تجزیه و تحلیل داده‌ها برای کاهش هزینه‌های سرور و بهبود عملکرد سیستم پرداخته می‌شود. 30 | 31 | //- Date/Time & Comments Count Info 32 | include layout/inc_date_time_info.pug 33 | 34 | article.card 35 | // Article 4 36 | h2: a(href='article-single.html') تفاوت بین شبکه‌های اجتماعی محبوب در ایران 37 | p در این مقاله به مقایسه شبکه‌های اجتماعی محبوب در ایران از جمله اینستاگرام، تلگرام، و توییتر پرداخته می‌شود و ویژگی‌ها، مزایا و معایب هر یک بررسی می‌شوند. 38 | 39 | //- Date/Time & Comments Count Info 40 | include layout/inc_date_time_info.pug 41 | 42 | article.card 43 | // Article 5 - Audio 44 | h2: a(href='article-single.html') آموزش برنامه‌نویسی Python 45 | audio(controls) 46 | source(src='assets/media/beep.mp3', type='audio/mpeg') 47 | | Your browser does not support the audio element. 48 | p در این مقاله به آموزش برنامه‌نویسی با زبان Python و مباحث مختلف از جمله لیست‌ها، شرط‌ها و حلقه‌ها پرداخته می‌شود. 49 | 50 | //- Date/Time & Comments Count Info 51 | include layout/inc_date_time_info.pug 52 | 53 | article.card 54 | // Article 6 - Video 55 | h2: a(href='article-single.html') آشنایی با برنامه‌نویسی وب 56 | video(controls) 57 | source(src='assets/media/sample_video.mp4', type='video/mp4') 58 | | Your browser does not support the video element. 59 | p در این مقاله به معرفی مفاهیم برنامه‌نویسی وب و استفاده از زبان‌های HTML، CSS و JavaScript برای ساخت صفحات وب پرداخته می‌شود. 60 | 61 | //- Date/Time & Comments Count Info 62 | include layout/inc_date_time_info.pug 63 | 64 | article.card 65 | // Article 7 - Code Block 66 | h2: a(href='article-single.html') آشنایی با توابع در Python 67 | p در این مقاله به آشنایی با توابع در زبان برنامه‌نویسی Python پرداخته می‌شود. در ادامه، یک نمونه کد Python ارائه می‌شود: 68 | pre.language-python 69 | code 70 | | def calculate_factorial(n): 71 | | if n == 0: 72 | | return 1 73 | | else: 74 | | return n * calculate_factorial(n-1) 75 | | 76 | | num = 5 77 | | print("Factorial of", num, "is", calculate_factorial(num)) 78 | 79 | //- Date/Time & Comments Count Info 80 | include layout/inc_date_time_info.pug 81 | 82 | 83 | //- Pagination row 84 | include layout/inc_pagination.pug -------------------------------------------------------------------------------- /pug/article-list.pug: -------------------------------------------------------------------------------- 1 | extends layout/_layout 2 | 3 | block variables 4 | - var pageTitle = "نوشته‌های دسته‌بندی تکنولوژی" 5 | 6 | block content 7 | 8 | // Breadcrumb navigation 9 | div.breadcrumb 10 | a(href="index.html") خانه 11 | | > 12 | a(href="article-list.html") مقاله‌ها 13 | | > 14 | | لیست نوشته‌های دسته‌بندی تکنولوژی 15 | 16 | 17 | article.card 18 | // Article 1 19 | div.gray-badge نمونه بج طوسی 20 | h2: a(href='article-single.html') چگونگی بهینه‌سازی وب‌سایت 21 | img(src='https://fakeimg.pl/800x300/5469a1/ffffff?text=Sample+image&font=lobster', alt='تصویر مقاله') 22 | p در این مقاله به بررسی روش‌های بهینه‌سازی وب‌سایت برای سرعت بیشتر، افزایش رتبه در نتایج جستجوی گوگل و بهبود تجربه کاربری پرداخته می‌شود. 23 | 24 | //- Date/Time & Comments Count Info 25 | include layout/inc_date_time_info.pug 26 | 27 | article.card 28 | // Article 2 - Audio 29 | div.red-badge نمونه بج قرمز 30 | h2: a(href='article-single.html') آموزش برنامه‌نویسی Python 31 | audio(controls) 32 | source(src='assets/media/beep.mp3', type='audio/mpeg') 33 | | Your browser does not support the audio element. 34 | p در این مقاله به آموزش برنامه‌نویسی با زبان Python و مباحث مختلف از جمله لیست‌ها، شرط‌ها و حلقه‌ها پرداخته می‌شود. 35 | 36 | //- Date/Time & Comments Count Info 37 | include layout/inc_date_time_info.pug 38 | 39 | article.card 40 | // Article 3 41 | h2: a(href='article-single.html') چگونگی کاهش هزینه‌های سرور با استفاده از تجزیه و تحلیل داده‌ها 42 | p در این مقاله به بررسی نحوه استفاده از تجزیه و تحلیل داده‌ها برای کاهش هزینه‌های سرور و بهبود عملکرد سیستم پرداخته می‌شود. 43 | 44 | //- Date/Time & Comments Count Info 45 | include layout/inc_date_time_info.pug 46 | 47 | article.card 48 | // Article 4 49 | h2: a(href='article-single.html') تفاوت بین شبکه‌های اجتماعی محبوب در ایران 50 | p در این مقاله به مقایسه شبکه‌های اجتماعی محبوب در ایران از جمله اینستاگرام، تلگرام، و توییتر پرداخته می‌شود و ویژگی‌ها، مزایا و معایب هر یک بررسی می‌شوند. 51 | 52 | //- Date/Time & Comments Count Info 53 | include layout/inc_date_time_info.pug 54 | 55 | article.card 56 | // Article 2 57 | h2: a(href='article-single.html') راهکارهایی برای بهبود امنیت شبکه 58 | p در این مقاله به بررسی راهکارهای مختلفی برای بهبود امنیت شبکه از جمله استفاده از فایروال، ابزارهای تشخیص تهدیدات، و کنترل دسترسی کاربران پرداخته می‌شود. 59 | 60 | //- Date/Time & Comments Count Info 61 | include layout/inc_date_time_info.pug 62 | 63 | 64 | article.card 65 | // Article 6 - Video 66 | h2: a(href='article-single.html') آشنایی با برنامه‌نویسی وب 67 | video(controls) 68 | source(src='assets/media/sample_video.mp4', type='video/mp4') 69 | | Your browser does not support the video element. 70 | p در این مقاله به معرفی مفاهیم برنامه‌نویسی وب و استفاده از زبان‌های HTML، CSS و JavaScript برای ساخت صفحات وب پرداخته می‌شود. 71 | 72 | //- Date/Time & Comments Count Info 73 | include layout/inc_date_time_info.pug 74 | 75 | article.card 76 | // Article 7 - Code Block 77 | h2: a(href='article-single.html') آشنایی با توابع در Python 78 | p در این مقاله به آشنایی با توابع در زبان برنامه‌نویسی Python پرداخته می‌شود. در ادامه، یک نمونه کد Python ارائه می‌شود: 79 | 80 | pre.language-python 81 | code 82 | | 83 | | def calculate_factorial(n): 84 | | if n == 0: 85 | | return 1 86 | | else: 87 | | return n * calculate_factorial(n-1) 88 | | 89 | | num = 5 90 | | print("Factorial of", num, "is", calculate_factorial(num)) 91 | | 92 | | 93 | | 94 | 95 | 96 | //- Date/Time & Comments Count Info 97 | include layout/inc_date_time_info.pug 98 | 99 | 100 | //- Pagination row 101 | include layout/inc_pagination.pug -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | 2 | ## Simple RTL Blog Template 3 | 4 | This is a simple, right-to-left (RTL) blog template designed for easy customization and deployment. It was created by [ChatGPT](https://openai.com/) and modified by [Milad Nouri](https://github.com/miladnouri). 5 | 6 | --- 7 | 8 | ### Usage 9 | 10 | This template offers two versions: 11 | 12 | - **HTML Version**: The HTML version is located in the `html` folder. It's suitable for users who prefer working with standard HTML. 13 | 14 | - **Pug Version**: The Pug (formerly Jade) version is available in the `pug` folder. Pug is a concise and expressive templating language for HTML. 15 | Use this version if you prefer Pug for templating. 16 | 17 | `pug -w ./pug -o ./html -P ` 18 | 19 | --- 20 | 21 | ### 🚀 Features 22 | 23 | - Minimal design for easy customization 24 | - Fully responsive layout 25 | - Built-in support for syntax highlighting 26 | - Simple and easy-to-use navigation menu 27 | 28 | --- 29 | 30 | ### 📂 Pages Included 31 | 32 | | Page | Description | 33 | |------|------------| 34 | | **Blog Page** | Display your latest blog posts, allowing readers to engage with your content. | 35 | | **Podcast Page** | Share your podcast episodes and provide users with an easy way to listen to them. | 36 | | **Contact Page** | Allow visitors to get in touch with you through a convenient contact form. | 37 | | **FAQ Page** | Answer frequently asked questions with expandable FAQ items to improve user experience. | 38 | | **About Page** | Share information about yourself or your blog and invite donations to support your project. | 39 | | **Timeline Page** | Showcase the author's journey and milestones in a visually appealing timeline format. | 40 | | **Donation Page** | Allow users to support the project financially through various payment options. | 41 | | **Static Page** | Create additional static pages to showcase various content, such as a portfolio or testimonials. | 42 | | **Gallery Page** | Display a collection of images to captivate your audience visually. | 43 | 44 | --- 45 | 46 | ### Used By 47 | 48 | - https://milad.nu/ 49 | - [Add your website to the list!] 50 | 51 | ### How To Contribute 52 | 53 | Contributions are welcome and encouraged! If you have any suggestions, bug fixes, or improvements, please follow these steps: 54 | 55 | 1. Fork this repository to your own GitHub account. 56 | 2. Clone the forked repository to your local machine. 57 | 3. Create a new branch for your changes. 58 | 4. Make your changes, commit them, and push to your forked repository. 59 | 5. Create a pull request from your forked repository's branch to the original repository's `main` branch. 60 | 61 | Please ensure that your contributions align with the purpose of this template and follow best practices for coding and documentation. 62 | 63 | --- 64 | 65 | ### Credits 66 | - [ChatGPT](https://openai.com/): Original template creator 67 | - [Milad Nouri](https://github.com/miladnouri): Modifications and updates to the template 68 | 69 | --- 70 | 71 | 72 | ### 💰 Support My Work & Content 73 | 74 | If you find my projects and content valuable and would like to support my efforts, consider making a donation. 75 | 76 | 👉 **[Donate Now](https://milad.nu/page/donate)** ❤️ 77 | 78 | --- 79 | 80 | ### 📸 Screenshots 81 | 82 |

83 | 84 | Home Page 85 | 86 | 87 | Article List 88 | 89 | 90 | Podcast Page 91 | 92 | 93 | About Timeline 94 | 95 | 96 | Donate Page 97 | 98 | 99 | Gallery Page 100 | 101 | 102 | Article Detail 103 | 104 | 105 |

106 | 107 | --- 108 | 109 | ### 📢 Stay Connected 110 | 111 | Follow my **Telegram channel** for updates, new projects, and my contents! 112 | 113 | 👉 **[Join @miladnourichannel](https://t.me/miladnourichannel)** -------------------------------------------------------------------------------- /pug/about-timeline.pug: -------------------------------------------------------------------------------- 1 | extends layout/_layout 2 | 3 | block variables 4 | - var pageTitle = "درباره من - تایملاین" 5 | 6 | block content 7 | 8 | 9 | // Breadcrumb navigation 10 | div.breadcrumb 11 | a(href="index.html") خانه 12 | | > 13 | | درباره من - تایملاین 14 | 15 | section.card 16 | h2 درباره من 17 | .about-text 18 | p 19 | img.about-photo(src='https://via.placeholder.com/200', alt='تصویر نمایه') 20 | | این یک وبلاگ است که به مقالات و مطالب مرتبط با برنامه‌نویسی و تکنولوژی می‌پردازد. ما سعی داریم 21 | | اطلاعات مفید و کاربردی را در اختیار کاربران علاقه‌مند به این حوزه قرار دهیم. امیدواریم که 22 | | از مطالب ما لذت ببرید و مفید بدانید. این وبلاگ با هدف ارتقاء دانش و آموزش جامعه برنامه‌نویسی و 23 | | مهندسان نرم‌افزار تأسیس شده است. در اینجا سعی می‌کنیم به صورت مرتب و منظم، مطالبی را منتشر 24 | | کنیم که به کاربران علاقه‌مند در این زمینه‌ها کمک کند و آن‌ها را با تازه‌ترین دانش‌ها و 25 | | تکنولوژی‌ها آشنا سازد. هدف ما ایجاد یک محتوای آموزشی، جذاب و مفید است که بتواند در حل مشکلات و 26 | | چالش‌های برنامه‌نویسی و تکنولوژی کاربران مؤثر باشد. 27 | p 28 | | برنامه‌نویسی یکی از حوزه‌های پرکاربرد و مهم دنیای فناوری اطلاعات است که انواع زبان‌ها و 29 | | تکنولوژی‌های مختلفی دارد. با پیشرفت تکنولوژی‌ها و نیازهای روزافزون بازار کار، به‌روز بودن با 30 | | آخرین تحولات برنامه‌نویسی ضروری است. این وبلاگ در جهت ارتقاء دانش کاربران و آشنایی آن‌ها با 31 | | تکنولوژی‌ها و الگوهای طراحی مختلف تأسیس شده است. 32 | 33 | p.article-info بروزرسانی: ۱۸ بهمن ۱۴۰۰ | ساعت ۴:۱۰ ب.ظ 34 | 35 | 36 | section.timeline-section 37 | h2 تاریخچه فعالیت‌های تحصیلی من 38 | .timeline 39 | .timeline-item 40 | .timeline-content 41 | h3 ۱۴۰۲ - شروع پایان‌نامه 42 | p آغاز نگارش پایان‌نامه در حوزه [موضوع تحقیقاتی] و تکمیل پروژه‌های مرتبط. 43 | .timeline-item 44 | .timeline-content 45 | h3 ۱۴۰۱ - تخصص در توسعه وب 46 | p مطالعه پیشرفته JavaScript و فریمورک‌های مدرن مانند ReactJS برای توسعه اپلیکیشن‌های تحت وب. 47 | .timeline-item 48 | .timeline-content 49 | h3 ۱۴۰۰ - پروژه دانشگاهی با Python 50 | p انجام اولین پروژه تحقیقاتی دانشگاهی با استفاده از Python و Django در حوزه [موضوع پروژه]. 51 | .timeline-item 52 | .timeline-content 53 | h3 ۱۳۹۹ - شروع تحصیلات دانشگاهی 54 | p آغاز دوره کارشناسی در رشته [نام رشته] و گذراندن دروس پایه مرتبط با علوم کامپیوتر. 55 | .timeline-item 56 | .timeline-content 57 | h3 ۱۳۹۸ - آمادگی برای دانشگاه 58 | p مطالعه منابع علمی و شرکت در دوره‌های آنلاین برای تقویت مهارت‌های برنامه‌نویسی. 59 | 60 | section.timeline-section 61 | h2 تاریخچه پروژه‌های من 62 | .timeline 63 | .timeline-item 64 | .timeline-content 65 | h3 ۱۳۹۷ - اولین اسکریپت خودکارسازی 66 | p توسعه یک اسکریپت ساده با 67 | a(href="https://www.python.org/" target="_blank") Python 68 | | برای پردازش داده‌های متنی و یادگیری اصول برنامه‌نویسی. 69 | .timeline-item 70 | .timeline-content 71 | h3 ۱۳۹۹ - توسعه اولین وب‌اپلیکیشن 72 | p طراحی و پیاده‌سازی یک سیستم مدیریت وظایف با 73 | a(href="https://www.djangoproject.com/" target="_blank") Django 74 | | و Python، شامل احراز هویت کاربران و پایگاه داده SQL. 75 | .timeline-item 76 | .timeline-content 77 | h3 ۱۴۰۰ - ساخت اولین اپلیکیشن SPA با React 78 | p یادگیری و توسعه یک اپلیکیشن تک‌صفحه‌ای (SPA) با 79 | a(href="https://react.dev/" target="_blank") ReactJS 80 | | برای نمایش داده‌های پویا و تعامل کاربر. 81 | .timeline-item 82 | .timeline-content 83 | h3 ۱۴۰۱ - پیاده‌سازی API اختصاصی 84 | p طراحی یک 85 | a(href="https://fastapi.tiangolo.com/" target="_blank") FastAPI 86 | | برای مدیریت داده‌های کاربران، ارائه سرویس‌های RESTful و ادغام با پایگاه داده NoSQL. 87 | .timeline-item 88 | .timeline-content 89 | h3 ۱۴۰۲ - توسعه و انتشار وبلاگ شخصی 90 | p ایجاد و بهینه‌سازی یک 91 | a(href="https://miladnouri.com/" target="_blank") وبلاگ 92 | | با استفاده از Next.js و بهینه‌سازی برای SEO و تجربه کاربری. 93 | .timeline-item 94 | .timeline-content 95 | h3 ۱۴۰۳ - پروژه مدیریت مالی شخصی 96 | p توسعه یک داشبورد مدیریت مالی با قابلیت تحلیل هزینه‌ها، درآمد و ارائه نمودارهای تعاملی. -------------------------------------------------------------------------------- /pug/podcast-single.pug: -------------------------------------------------------------------------------- 1 | extends layout/_layout 2 | 3 | block variables 4 | - var pageTitle = "صفحه پادکست تکی" 5 | 6 | block content 7 | 8 | // Breadcrumb navigation 9 | div.breadcrumb 10 | a(href="index.html") خانه 11 | | > 12 | a(href="podcast-list.html") پادکست 13 | | > اپیزودهای دسته‌بندی تکنولوژی 14 | 15 | 16 | 17 | //- Podcast Episode 1 18 | article.card 19 | h2 20 | a(href="podcast-single.html") پادکست تکنولوژی | قسمت ۱: چالش‌ها و راهکارهای حفاظت از اطلاعات شخصی در دنیای دیجیتال 21 | img(src="https://fakeimg.pl/800x200/5469a1/ffffff?text=Episode%201&font=lobster", alt="تصویر قسمت ۱") 22 | audio(controls) 23 | source(src='assets/media/beep.mp3', type='audio/mpeg') 24 | | Your browser does not support the audio element. 25 | p 26 | | در این قسمت به بحث در مورد تکنولوژی X و چگونگی استفاده از آن پرداخته می‌شود. 27 | .podcast-buttons 28 | a(href="#" target="_blank") گوش دادن در اسپاتیفای 29 | a(href="#" target="_blank") گوش دادن در گوگل پادکست 30 | a(href="#" target="_blank") گوش دادن در اپل پادکست 31 | a(href="#" target="_blank") گوش دادن در کست‌باکس 32 | 33 | //- Article Tags 34 | .article-tags 35 | h5 برچسب‌ها: 36 | ul.tags-list 37 | li 38 | a(href="podcast-list.html") تکنولوژی 39 | li 40 | a(href="podcast-list.html") برنامه‌نویسی وب 41 | li 42 | a(href="podcast-list.html") HTML 43 | li 44 | a(href="podcast-list.html") CSS 45 | li 46 | a(href="podcast-list.html") JavaScript 47 | 48 | //- Share Buttons 49 | .share-buttons 50 | h5 اشتراک‌گذاری: 51 | ul.social-list 52 | li 53 | a(href="https://t.me/share/url?url=YOUR_URL_HERE", class="social-icon telegram", target="_blank", title="اشتراک گذاری در تلگرام") 54 | i.fab.fa-telegram-plane 55 | li 56 | a(href="https://twitter.com/intent/tweet?url=YOUR_URL_HERE&text=YOUR_TEXT_HERE", class="social-icon twitter", target="_blank", title="اشتراک گذاری در توییتر") 57 | i.fab.fa-twitter 58 | li 59 | a(href="https://api.whatsapp.com/send?text=YOUR_TEXT_HERE%20YOUR_URL_HERE", class="social-icon whatsapp", target="_blank", title="اشتراک گذاری در واتساپ") 60 | i.fab.fa-whatsapp 61 | li 62 | a(href="https://www.facebook.com/sharer/sharer.php?u=YOUR_URL_HERE", class="social-icon facebook", target="_blank", title="اشتراک گذاری در فیسبوک") 63 | i.fab.fa-facebook-f 64 | li 65 | a(href="https://www.linkedin.com/shareArticle?url=YOUR_URL_HERE&title=YOUR_TITLE_HERE", class="social-icon linkedin", target="_blank", title="اشتراک گذاری در لینکداین") 66 | i.fab.fa-linkedin-in 67 | 68 | //- Add more share buttons for other social media platforms as needed 69 | 70 | //- Date/Time & Comments Count Info 71 | include layout/inc_date_time_info.pug 72 | 73 | //- Related Articles List 74 | .related-articles-list 75 | h4 سایر اپیزودها 76 | ul 77 | li 78 | a(href="#") اپیزود قبل: هوش مصنوعی در زندگی روزمره: اثرات مثبت و چالش‌های اجتماعی 79 | li 80 | a(href="#") اپیزود بعد: بلاک‌چین: پشت پرده فناوری ارزهای دیجیتال و کاربردهای آینده 81 | //- Add more related articles as needed 82 | 83 | //- Comments Section 84 | .comments-section 85 | h4 نظرات (۳ نظر) 86 | .card 87 | h4 نام کاربری ۱ 88 | p مقاله بسیار خوبی بود. ممنون از اشتراک‌گذاری این مطالب مفید. 89 | p.comment-info تاریخ: ۲۲ بهمن ۱۴۰۰ | ساعت: ۱۲:۰۰ ق.ظ 90 | 91 | .card 92 | h4 نام کاربری ۲ 93 | p متن مقاله جذاب و روان بود. اطلاعات مفیدی برایم ارائه کردید. ادامه دهید. 94 | p.comment-info تاریخ: ۲۲ بهمن ۱۴۰۰ | ساعت: ۱:۳۰ ب.ظ 95 | 96 | .card 97 | h4 نام کاربری ۳ 98 | p واقعا لذت بردم! ممنون بابت این محتواهای ارزشمند. 99 | p.comment-info تاریخ: ۲۳ بهمن ۱۴۰۰ | ساعت: ۱۰:۴۵ ق.ظ 100 | 101 | //- Add New Comment 102 | .card 103 | h4 ثبت نظر 104 | form 105 | label(for="username") نام کاربری: 106 | input(type="text", id="username", required) 107 | 108 | label(for="comment") نظر شما: 109 | textarea(id="comment", rows="4", required) 110 | 111 | button(type="submit") ارسال نظر -------------------------------------------------------------------------------- /pug/podcast-list.pug: -------------------------------------------------------------------------------- 1 | extends layout/_layout 2 | 3 | block variables 4 | - var pageTitle = "صفحه پادکست" 5 | 6 | block content 7 | 8 | // Breadcrumb navigation 9 | div.breadcrumb 10 | a(href="index.html") خانه 11 | | > 12 | a(href="podcast-list.html") پادکست 13 | | > اپیزودهای دسته‌بندی تکنولوژی 14 | 15 | section.card 16 | h2 پادکست تازه‌های تکنولوژی 17 | .about-text 18 | p 19 | img.about-photo(src="https://via.placeholder.com/200", alt="تصویر نمایه") 20 | | به پادکست "تازه‌های تکنولوژی" خوش آمدید! در این پادکست، به بررسی و بحث درباره آخرین اخبار و تحولات جهان فناوری می‌پردازیم. از تازه‌ترین دستاوردهای علمی تا لحظه‌ی عرضه‌ی دستگاه‌ها و خدمات جدید، همه چیز را درباره دنیای فناوری در این پادکست خواهید شنید. با ما همراه شوید و به دنیایی پر از نوآوری و تحولات عجیب و جذاب سفر کنید. 21 | p 22 | | با گسترش روزافزون فناوری در تمامی جوانب زندگی، پادکست "تازه‌های تکنولوژی" تصمیم گرفته است تا به شما تجربه‌ای جامع و البته سرگرم‌کننده از اخبار تکنولوژی ارائه دهد. از مبتکران ویژه‌ای که با ابداعاتشان دنیای فناوری را شکل می‌دهند تا تحلیل‌های عمیق در مورد اثرات اجتماعی و اقتصادی تکنولوژی، ما همه جنبه‌های این دنیای پویا را روایت می‌کنیم. هدف ما از این پادکست، به اشتراک گذاشتن اطلاعاتی است که به شما کمک می‌کند تا درک بهتری از چگونگی تأثیر تکنولوژی بر جامعه و زندگی روزمره پیدا کنید. 23 | 24 | .podcast-buttons 25 | a.castbox(href="#" target="_blank") 26 | i.fa-solid.fa-circle-play 27 | | اشتراک در کست‌باکس 28 | a.google-podcast(href="#" target="_blank") 29 | i.fab.fa-google 30 | | اشتراک در گوگل پادکست 31 | a.apple-podcast(href="#" target="_blank") 32 | i.fab.fa-apple 33 | | اشتراک در اپل پادکست 34 | a.spotify(href="#" target="_blank") 35 | i.fab.fa-spotify 36 | | اشتراک در اسپاتیفای 37 | 38 | //- Podcast Episode 1 39 | article.card 40 | h2 41 | a(href="podcast-single.html") قسمت ۱: چالش‌ها و راهکارهای حفاظت از اطلاعات شخصی در دنیای دیجیتال 42 | img(src="https://fakeimg.pl/800x200/5469a1/ffffff?text=Episode%201&font=lobster", alt="تصویر قسمت ۱") 43 | audio(controls) 44 | source(src='assets/media/beep.mp3', type='audio/mpeg') 45 | | Your browser does not support the audio element. 46 | p 47 | | در این قسمت به بحث در مورد تکنولوژی X و چگونگی استفاده از آن پرداخته می‌شود. 48 | .podcast-buttons 49 | a(href="#" target="_blank") گوش دادن در اسپاتیفای 50 | a(href="#" target="_blank") گوش دادن در گوگل پادکست 51 | a(href="#" target="_blank") گوش دادن در اپل پادکست 52 | a(href="#" target="_blank") گوش دادن در کست‌باکس 53 | 54 | //- Date/Time & Comments Count Info 55 | include layout/inc_date_time_info.pug 56 | 57 | //- Podcast Episode 2 58 | article.card 59 | h2 60 | a(href="podcast-single.html") قسمت ۲: عنوان قسمت 61 | img(src="https://fakeimg.pl/800x200/5469a1/ffffff?text=Episode%202&font=lobster", alt="تصویر قسمت ۲") 62 | audio(controls) 63 | source(src='assets/media/beep.mp3', type='audio/mpeg') 64 | | Your browser does not support the audio element. 65 | p 66 | | در این قسمت به بحث در مورد تکنولوژی Y و نقش آن در جامعه پرداخته می‌شود. 67 | .podcast-buttons 68 | a(href="#" target="_blank") گوش دادن در اسپاتیفای 69 | a(href="#" target="_blank") گوش دادن در گوگل پادکست 70 | a(href="#" target="_blank") گوش دادن در اپل پادکست 71 | a(href="#" target="_blank") گوش دادن در کست‌باکس 72 | 73 | //- Date/Time & Comments Count Info 74 | include layout/inc_date_time_info.pug 75 | 76 | //- Podcast Episode 3 77 | article.card 78 | h2 79 | a(href="podcast-single.html") قسمت ۳: عنوان قسمت 80 | img(src="https://fakeimg.pl/800x200/5469a1/ffffff?text=Episode%203&font=lobster", alt="تصویر قسمت ۳") 81 | audio(controls) 82 | source(src='assets/media/beep.mp3', type='audio/mpeg') 83 | | Your browser does not support the audio element. 84 | p 85 | | در این قسمت به بحث در مورد تکنولوژی Z و چالش‌های پیش روی آن پرداخته می‌شود. 86 | .podcast-buttons 87 | a(href="#" target="_blank") گوش دادن در اسپاتیفای 88 | a(href="#" target="_blank") گوش دادن در گوگل پادکست 89 | a(href="#" target="_blank") گوش دادن در اپل پادکست 90 | a(href="#" target="_blank") گوش دادن در کست‌باکس 91 | 92 | //- Date/Time & Comments Count Info 93 | include layout/inc_date_time_info.pug 94 | 95 | //- Repeat for more episodes 96 | 97 | //- Pagination row 98 | include layout/inc_pagination.pug -------------------------------------------------------------------------------- /pug/layout/_layout.pug: -------------------------------------------------------------------------------- 1 | block variables 2 | 3 | doctype html 4 | html(lang='fa', dir='rtl') 5 | head 6 | // Document metadata 7 | meta(charset='UTF-8') 8 | meta(name='viewport', content='width=device-width, initial-scale=1.0') 9 | title #{pageTitle} 10 | meta(name='description', content='توضیحات مربوط به صفحه') 11 | meta(name='keywords', content='کلمات کلیدی مربوط به صفحه') 12 | meta(name='author', content='نام نویسنده') 13 | meta(name='robots', content='index, follow') 14 | 15 | // Open Graph meta tags 16 | meta(property='og:title', content='عنوان صفحه') 17 | meta(property='og:description', content='توضیحات مربوط به صفحه') 18 | meta(property='og:type', content='website') 19 | meta(property='og:url', content='آدرس صفحه') 20 | meta(property='og:image', content='آدرس تصویر') 21 | 22 | // Twitter Cards meta tags 23 | meta(name='twitter:card', content='summary_large_image') 24 | meta(name='twitter:title', content='عنوان صفحه') 25 | meta(name='twitter:description', content='توضیحات مربوط به صفحه') 26 | meta(name='twitter:image', content='آدرس تصویر') 27 | 28 | // External stylesheet 29 | link(rel='stylesheet', href='assets/style.css?v=1.3.2') 30 | body 31 | header 32 | // Website header 33 | h1 وبلاگ من 34 | h2 زیرعنوان وبلاگ من 35 | nav 36 | // Navigation menu 37 | ul 38 | li: a(href='index.html') خانه 39 | li: a(href='about.html') درباره من 40 | li: a(href='contact.html') تماس با ما 41 | li: a(href='podcast-list.html') پادکست 42 | li: a(href='page.html') صفحه متنی 43 | li: a(href='gallery.html') گالری 44 | li.dropdown 45 | a(href='#') منوی بازشو 46 | ul.dropdown-content 47 | li: a(href='article-list.html') لیست مقاله‌ها 48 | li: a(href='page.html') قوانین و مقررات 49 | li: a(href='faq.html') سوال‌های متداول 50 | 51 | .container 52 | // Main content section 53 | main 54 | block content 55 | 56 | // Sidebar 57 | aside.sidebar 58 | 59 | // Social media boxes 60 | 61 | 62 | div.social-icons 63 | 64 | a.social-box-small.twitter(href='https://twitter.com/', target='_blank', title='توییتر من') 65 | i.fab.fa-twitter 66 | a.social-box-small.telegram(href='https://telegram.org/', target='_blank', title='کانال تلگرام') 67 | i.fab.fa-telegram-plane 68 | a.social-box-small.youtube(href='https://www.youtube.com/', target='_blank', title='کانال یوتوب') 69 | i.fab.fa-youtube 70 | a.social-box-small.instagram(href='https://www.instagram.com/', target='_blank', title='اینستاگرام من') 71 | i.fab.fa-instagram 72 | a.social-box-small.mastadon(href='https://mastodon.social/', target='_blank', title='ماستادون من') 73 | i.fab.fa-mastodon 74 | a.social-box-small.github(href='https://github.com/', target='_blank', title='گیت‌هاب من') 75 | i.fab.fa-github 76 | 77 | a.social-box.twitter(href='https://twitter.com/', target='_blank', title='توییتر من') توییتر من 78 | a.social-box.telegram(href='https://telegram.org/', target='_blank', title='کانال تلگرام') کانال تلگرام 79 | a.social-box.youtube(href='https://www.youtube.com/', target='_blank', title='کانال یوتوب') کانال یوتوب 80 | a.social-box.instagram(href='https://www.instagram.com/', target='_blank', title='اینستاگرام من') اینستاگرام من 81 | a.social-box.mastadon(href='https://mastodon.social/', target='_blank', title='ماستادون من') ماستادون من 82 | 83 | div.card 84 | form(method='get', action='#') 85 | input(type='text', placeholder='جستجوی نوشته‌ها...') 86 | button(type='submit') >> 87 | 88 | div.card 89 | h5.sidebar-card-title دسته‌بندی‌ها 90 | ul 91 | li: a(href='article-list.html') تکنولوژی 92 | li: a(href='article-list.html') گجت‌ها 93 | li: a(href='article-list.html') نرم‌افزار 94 | li: a(href='article-list.html') هوش مصنوعی 95 | li: a(href='article-list.html') اینترنت اشیاء (IoT) 96 | li: a(href='article-list.html') امنیت اطلاعات 97 | li: a(href='article-list.html') بلاک‌چین 98 | // Add more categories as needed 99 | 100 | div.card 101 | h5.sidebar-card-title سال‌های قبل در چنین روزی 102 | ul 103 | li: a(href='article-single.html') تکنولوژی‌های نوظهور در دنیای اینترنت اشیاء 104 | li: a(href='article-single.html') آخرین روند‌ها در توسعه‌ی نرم‌افزارهای مبتنی بر هوش مصنوعی 105 | li: a(href='article-single.html') چالش‌ها و راهکارهای امنیت سایبری در دنیای ارتباطات هوشمند 106 | li: a(href='article-single.html') جهش‌های بزرگ در تکنولوژی‌های رایانه‌ای و شبکه‌های پرسرعت 107 | li: a(href='article-single.html') کاربردهای جدید فناوری بلاکچین در صنعت‌های مختلف 108 | // Add more articles as needed 109 | 110 | div.card 111 | h5.sidebar-card-title آخرین گفتگوهای من 112 | ul 113 | li: a(href='#') گفت‌و‌گو با مهندس نرم‌افزار درباره آینده‌ی هوش مصنوعی 114 | li: a(href='#') مصاحبه با مخترع اینترنت اشیاء در مورد ارتباطات هوشمند 115 | li: a(href='#') گفت‌و‌گو با دیزاینر UI/UX درباره آخرین ترند‌های طراحی وب 116 | li: a(href='#') مصاحبه با دانشمند داده‌ها در مورد تحلیل‌های پیشرفته 117 | // Add more conversations as needed 118 | 119 | // Tags Section 120 | div.card 121 | h5.sidebar-card-title برچسب‌ها 122 | ul.tags-list 123 | li: a(href='article-list.html') تکنولوژی 124 | li: a(href='article-list.html') برنامه‌نویسی 125 | li: a(href='article-list.html') شبکه‌ها 126 | li: a(href='article-list.html') امنیت 127 | li: a(href='article-list.html') هوش مصنوعی 128 | li: a(href='article-list.html') انترنت اشیاء 129 | li: a(href='article-list.html') اندروید 130 | li: a(href='article-list.html') iOS 131 | li: a(href='article-list.html') تجارت الکترونیک 132 | li: a(href='article-list.html') بلاکچین 133 | 134 | footer 135 | // Website footer 136 | p تمامی حقوق محفوظ است. © ۱۴۰۳ 137 | p: a(href='https://github.com/miladnouri/simple-blog-template', target='_blank') این قالب با استفاده از ChatGPT ساخته شده و توسط میلاد نوری بهینه شده است. 138 | 139 | script(type='text/javascript', src='assets/prism.js') 140 | -------------------------------------------------------------------------------- /html/layout/_layout.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 |
28 | 29 |

وبلاگ من

30 |

زیرعنوان وبلاگ من

31 | 49 |
50 |
51 | 52 |
53 |
54 | 55 | 115 |
116 | 121 | 122 | 123 | -------------------------------------------------------------------------------- /pug/article-single.pug: -------------------------------------------------------------------------------- 1 | extends layout/_layout 2 | 3 | block variables 4 | - var pageTitle = "نوشته تک" 5 | 6 | block content 7 | 8 | // Breadcrumb navigation 9 | div.breadcrumb 10 | a(href="index.html") خانه 11 | | > 12 | a(href="article-list.html") مقاله‌ها 13 | | > 14 | | لیست نوشته‌های دسته‌بندی تکنولوژی 15 | 16 | article.card 17 | // Article Content 18 | h1 19 | a(href="#") آموزش برنامه‌نویسی وب 20 | img(src="https://fakeimg.pl/800x300/5469a1/ffffff?text=Sample+image&font=lobster", alt="تصویر مقاله") 21 | p 22 | | در این مقاله به آموزش برنامه‌نویسی وب با استفاده از زبان‌های HTML، CSS و JavaScript پرداخته می‌شود. این آموزش شامل مفاهیم مختلفی از جمله تعریف صفحات وب با HTML، استایل دهی به صفحات با CSS و اضافه کردن افکت‌ها و تعاملات با استفاده از JavaScript می‌باشد. 23 | 24 | h1 نمونه متن قرار گرفته در تگ h1 25 | h2 نمونه متن قرار گرفته در تگ h2 26 | h3 نمونه متن قرار گرفته در تگ h3 27 | h4 نمونه متن قرار گرفته در تگ h4 28 | h5 نمونه متن قرار گرفته در تگ h5 29 | 30 | h3 تصویر نمونه 31 | img(src="https://fakeimg.pl/800x100/eb4034/ffffff?text=Java+Script", alt="تصویر آموزش") 32 | 33 | h3 آموزش صوتی 34 | audio(controls) 35 | source(src='assets/media/beep.mp3', type='audio/mpeg') 36 | | Your browser does not support the audio element. 37 | p 38 | | شما می‌توانید این آموزش صوتی را برای گوش دادن به مباحث آموزش برنامه‌نویسی وب با استفاده از زبان‌های مختلف مانند HTML، CSS و JavaScript استفاده کنید. 39 | 40 | h3 آموزش ویدئویی 41 | video(controls) 42 | source(src="assets/media/sample_video.mp4", type="video/mp4") 43 | | Your browser does not support the video element. 44 | p 45 | | شما می‌توانید این آموزش ویدئویی را ببینید تا بهتر و قدم به قدم نحوه کدنویسی و اجرای برنامه‌های وب را یاد بگیرید. 46 | 47 | h3 کد نمونه - HTML و CSS 48 | pre.language-markup 49 | code 50 | | <!DOCTYPE html> 51 | | <html> 52 | | <head> 53 | | <title>صفحه وب نمونه</title> 54 | | <link rel="stylesheet" href="style.css"> 55 | | </head> 56 | | <body> 57 | | <h1>این یک صفحه وب نمونه است</h1> 58 | | <p>این یک متن نمونه است که به عنوان توضیح در صفحه قرار می‌گیرد.</p> 59 | | </body> 60 | | </html> 61 | p 62 | | این کد نمونه، یک صفحه وب ساده با استفاده از زبان‌های HTML و CSS را نشان می‌دهد. با اجرای این کد در مرورگر، شما یک صفحه وب ساده با یک عنوان و یک پاراگراف متنی خواهید داشت. 63 | 64 | h3 کد نمونه - JavaScript 65 | pre.language-js 66 | code 67 | | // JavaScript Sample Code 68 | | function greet(name) { 69 | | return "Hello, " + name + "!"; 70 | | } 71 | | 72 | | var user = "John"; 73 | | var message = greet(user); 74 | | console.log(message); 75 | p 76 | | این کد نمونه نشان می‌دهد چگونه از زبان برنامه‌نویسی JavaScript برای تعریف تابع ساده‌ای استفاده کنید و از آن در کنسول مرورگر خروجی بگیرید. 77 | 78 | // Article Tags 79 | .article-tags 80 | h5 برچسب‌ها: 81 | ul.tags-list 82 | li 83 | a(href="#") تکنولوژی 84 | li 85 | a(href="#") برنامه‌نویسی وب 86 | li 87 | a(href="#") HTML 88 | li 89 | a(href="#") CSS 90 | li 91 | a(href="#") JavaScript 92 | 93 | // Share Buttons 94 | .share-buttons 95 | h5 اشتراک‌گذاری: 96 | ul.social-list 97 | li 98 | a(href="https://t.me/share/url?url=YOUR_URL_HERE", class="social-icon telegram", target="_blank", title="اشتراک گذاری در تلگرام") 99 | i.fab.fa-telegram-plane 100 | li 101 | a(href="https://twitter.com/intent/tweet?url=YOUR_URL_HERE&text=YOUR_TEXT_HERE", class="social-icon twitter", target="_blank", title="اشتراک گذاری در توییتر") 102 | i.fab.fa-twitter 103 | li 104 | a(href="https://api.whatsapp.com/send?text=YOUR_TEXT_HERE%20YOUR_URL_HERE", class="social-icon whatsapp", target="_blank", title="اشتراک گذاری در واتساپ") 105 | i.fab.fa-whatsapp 106 | li 107 | a(href="https://www.facebook.com/sharer/sharer.php?u=YOUR_URL_HERE", class="social-icon facebook", target="_blank", title="اشتراک گذاری در فیسبوک") 108 | i.fab.fa-facebook-f 109 | li 110 | a(href="https://www.linkedin.com/shareArticle?url=YOUR_URL_HERE&title=YOUR_TITLE_HERE", class="social-icon linkedin", target="_blank", title="اشتراک گذاری در لینکداین") 111 | i.fab.fa-linkedin-in 112 | // Add more share buttons for other social media platforms as needed 113 | 114 | 115 | //- Date/Time & Comments Count Info 116 | include layout/inc_date_time_info.pug 117 | 118 | // Related Articles List 119 | .related-articles-list 120 | h4 نوشته‌های مشابه (حالت ساده) 121 | ul 122 | li 123 | a(href="#") آموزش پیشرفته CSS 124 | li 125 | a(href="#") آشنایی با جدیدترین ویژگی‌های HTML5 126 | // Add more related articles as needed 127 | 128 | // Related Articles 129 | section.related-articles 130 | h3 نوشته‌های مشابه (حالت کارت) 131 | article.related-article.card 132 | h3 133 | a(href="#") آموزش پیشرفته CSS 134 | p 135 | | در این مقاله به تکنیک‌ها و ترفندهای پیشرفته در CSS پرداخته می‌شود... 136 | article.related-article.card 137 | h3 138 | a(href="#") آشنایی با جدیدترین ویژگی‌های HTML5 139 | p 140 | | در این مقاله به ویژگی‌های جدید و مهم HTML5 می‌پردازیم... 141 | // Add more related articles as needed 142 | 143 | // Comments Section 144 | .comments-section 145 | h4 نظرات (۳ نظر) 146 | .card 147 | h4 نام کاربری ۱ 148 | p 149 | | مقاله بسیار خوبی بود. ممنون از اشتراک‌گذاری این مطالب مفید. 150 | p.comment-info تاریخ: ۲۲ بهمن ۱۴۰۰ | ساعت: ۱۲:۰۰ ق.ظ 151 | .card 152 | h4 نام کاربری ۲ 153 | p 154 | | متن مقاله جذاب و روان بود. اطلاعات مفیدی برایم ارائه کردید. ادامه دهید. 155 | p.comment-info تاریخ: ۲۲ بهمن ۱۴۰۰ | ساعت: ۱:۳۰ ب.ظ 156 | .card 157 | h4 نام کاربری ۳ 158 | p 159 | | واقعا لذت بردم! ممنون بابت این محتواهای ارزشمند. 160 | p.comment-info تاریخ: ۲۳ بهمن ۱۴۰۰ | ساعت: ۱۰:۴۵ ق.ظ 161 | 162 | // Add New Comment 163 | .card 164 | h4 ثبت نظر 165 | form 166 | label(for="username") نام کاربری: 167 | input(type="text", id="username", required) 168 | label(for="comment") نظر شما: 169 | textarea(id="comment", rows="4", required) 170 | button(type="submit") ارسال نظر 171 | -------------------------------------------------------------------------------- /html/donate.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | حمایت مالی 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 |
28 | 29 |

وبلاگ من

30 |

زیرعنوان وبلاگ من

31 | 49 |
50 |
51 | 52 |
53 | 54 |
خانه > 55 | حمایت مالی 56 |
57 |
58 |

حمایت مالی (نمونه ۱)

59 |

اگر از محتوای وبلاگ ما لذت می‌برید و می‌خواهید ما را حمایت کنید، می‌توانید با کلیک بر روی دکمه زیر اقدام به اهدای مبلغ دلخواه خود کنید. هر یک از حمایت‌های شما، به ما در ادامه تولید محتوا کمک می‌کند.

60 |
حمایت با PayPalحمایت با Bitcoinحمایت با Ethereumحمایت با Dogecoin
61 |
62 |
63 |

حمایت مالی (نمونه ۲)

64 |

اگر از محتوای وبلاگ ما لذت می‌برید و می‌خواهید ما را حمایت کنید، می‌توانید با کلیک بر روی دکمه زیر اقدام به اهدای مبلغ دلخواه خود کنید. هر یک از حمایت‌های شما، به ما در ادامه تولید محتوا کمک می‌کند.

65 | 66 |
67 |
68 | 69 | 129 |
130 | 135 | 136 | 137 | -------------------------------------------------------------------------------- /html/contact.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | تماس با من 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 |
28 | 29 |

وبلاگ من

30 |

زیرعنوان وبلاگ من

31 | 49 |
50 |
51 | 52 |
53 | 54 |
خانه > 55 | تماس با من 56 |
57 |
58 |

تماس با من

59 |

برای ارتباط با من، لطفاً فرم زیر را پر کنید یا از اطلاعات تماس پایین استفاده کنید.

60 |
61 |

آدرس ایمیل:

62 |

تلفن: 123-456-7890

63 |

آدرس: تهران، خیابان مثال، کوچه تست، پلاک 123

64 |
65 |
66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 |
74 |
75 |
76 | 77 | 137 |
138 | 143 | 144 | 145 | -------------------------------------------------------------------------------- /html/page.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | صفحه متنی 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 |
28 | 29 |

وبلاگ من

30 |

زیرعنوان وبلاگ من

31 | 49 |
50 |
51 | 52 |
53 |
54 |

قوانین و مقررات

55 |
56 |

57 | این یک وبلاگ است که به مقالات و مطالب مرتبط با برنامه‌نویسی و تکنولوژی می‌پردازد. ما سعی داریم 58 | اطلاعات مفید و کاربردی را در اختیار کاربران علاقه‌مند به این حوزه قرار دهیم. امیدواریم که 59 | از مطالب ما لذت ببرید و مفید بدانید. این وبلاگ با هدف ارتقاء دانش و آموزش جامعه برنامه‌نویسی و 60 | مهندسان نرم‌افزار تأسیس شده است. در اینجا سعی می‌کنیم به صورت مرتب و منظم، مطالبی را منتشر 61 | کنیم که به کاربران علاقه‌مند در این زمینه‌ها کمک کند و آن‌ها را با تازه‌ترین دانش‌ها و 62 | تکنولوژی‌ها آشنا سازد. هدف ما ایجاد یک محتوای آموزشی، جذاب و مفید است که بتواند در حل مشکلات و 63 | چالش‌های برنامه‌نویسی و تکنولوژی کاربران مؤثر باشد. 64 |

65 |

66 | برنامه‌نویسی یکی از حوزه‌های پرکاربرد و مهم دنیای فناوری اطلاعات است که انواع زبان‌ها و 67 | تکنولوژی‌های مختلفی دارد. با پیشرفت تکنولوژی‌ها و نیازهای روزافزون بازار کار، به‌روز بودن با 68 | آخرین تحولات برنامه‌نویسی ضروری است. این وبلاگ در جهت ارتقاء دانش کاربران و آشنایی آن‌ها با 69 | تکنولوژی‌ها و الگوهای طراحی مختلف تأسیس شده است. 70 |

71 |

بروزرسانی: ۱۸ بهمن ۱۴۰۰ | ساعت ۴:۱۰ ب.ظ

72 |
73 |
74 |
75 | 76 | 136 |
137 | 142 | 143 | 144 | -------------------------------------------------------------------------------- /html/gallery.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | گالری 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 |
28 | 29 |

وبلاگ من

30 |

زیرعنوان وبلاگ من

31 | 49 |
50 |
51 | 52 |
53 |
54 |

گالری (مثلا لیست مصاحبه‌ها)

55 |
56 |
تصویر 1 57 |
58 |

عنوان تصویر 1

59 |

۲۲ مهر ۱۴۰۲

60 |
61 |
تصویر 2 62 |
63 |

عنوان تصویر 2

64 |

۲۲ مهر ۱۴۰۲

65 |
66 |
تصویر 3 67 |
68 |

عنوان تصویر 3

69 |

۲۲ مهر ۱۴۰۲

70 |
71 |
تصویر 4 72 |
73 |

عنوان تصویر 4

74 |

۲۲ مهر ۱۴۰۲

75 |
76 |
تصویر 5 77 |
78 |

عنوان تصویر 5

79 |

۲۲ مهر ۱۴۰۲

80 |
81 |
تصویر 6 82 |
83 |

عنوان تصویر 6

84 |

۲۲ مهر ۱۴۰۲

85 |
86 |
87 |
88 |
89 | 90 | 150 |
151 | 156 | 157 | 158 | -------------------------------------------------------------------------------- /html/faq.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | سوال‌های متداول 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 |
28 | 29 |

وبلاگ من

30 |

زیرعنوان وبلاگ من

31 | 49 |
50 |
51 | 52 |
53 |
54 |

سوال‌های متداول درباره خدمات شرکت برنامه‌نویسی

55 |
56 |

چه خدماتی توسط این شرکت برنامه‌نویسی ارائه می‌شود؟

57 |
58 |

شرکت ما در زمینه توسعه نرم‌افزار، طراحی وب، تست کیفیت و مشاوره فنی فعالیت می‌کند. ما انواع نرم‌افزارهای تجاری و سفارشی را بر اساس نیازهای شما توسعه می‌دهیم.

59 |
60 |
61 |
62 |

آیا می‌توانید به طراحی و توسعه وبسایت‌های پویا پرداخت؟

63 |
64 |

بله، ما تجربه طراحی و توسعه وبسایت‌های پویا را داریم. ما از تکنولوژی‌های مدرن مانند React و Vue.js برای ساخت وبسایت‌های پویا استفاده می‌کنیم.

65 |
66 |
67 |
68 |

آیا خدمات شما شامل تست و اعتبارسنجی نرم‌افزارها نیز می‌شود؟

69 |
70 |

بله، تست کیفیت و اعتبارسنجی نرم‌افزارها نیز جزو خدمات ما می‌باشد. ما از روش‌ها و ابزارهای مدرن برای اطمینان از کارکرد صحیح نرم‌افزارها استفاده می‌کنیم.

71 |
72 |
73 |
74 |

آیا مشاوره فنی در زمینه تکنولوژی‌های جدید نیز ارائه می‌شود؟

75 |
76 |

بله، ما به عنوان متخصصان در حوزه فناوری اطلاعات، مشاوره فنی در زمینه تکنولوژی‌های جدید و روندهای بازار را ارائه می‌دهیم تا بهترین تصمیمات را برای پروژه‌های شما بگیرید.

77 |
78 |
79 |
80 |

آیا قادر به ارائه نرم‌افزارهای مخصوص صنایع خاص هستید؟

81 |
82 |

بله، ما توانایی توسعه نرم‌افزارهای مخصوص به صنایع خاص را داریم. بسته به نیازها و مشخصات فنی، نرم‌افزارهایی را برای صنایع مانند بهداشت، مالی، و تولید توسعه می‌دهیم.

83 |
84 |
85 |
86 |

آیا پشتیبانی و تعمیرات نیز از خدمات شما است؟

87 |
88 |

بله، پس از تحویل پروژه، ما پشتیبانی و تعمیرات لازم را ارائه می‌دهیم تا مطمئن شوید که نرم‌افزارها به درستی کار می‌کنند و در صورت نیاز به به‌روزرسانی‌ها و تغییرات، آماده‌ایم.

89 |
90 |
91 | 92 |
93 | 103 |
104 | 105 | 165 |
166 | 171 | 172 | 173 | -------------------------------------------------------------------------------- /html/about.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | درباره من 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 |
28 | 29 |

وبلاگ من

30 |

زیرعنوان وبلاگ من

31 | 49 |
50 |
51 | 52 |
53 | 54 |
خانه > 55 | درباره من 56 |
57 |
58 |

درباره من

59 |
60 |

تصویر نمایهاین یک وبلاگ است که به مقالات و مطالب مرتبط با برنامه‌نویسی و تکنولوژی می‌پردازد. ما سعی داریم 61 | اطلاعات مفید و کاربردی را در اختیار کاربران علاقه‌مند به این حوزه قرار دهیم. امیدواریم که 62 | از مطالب ما لذت ببرید و مفید بدانید. این وبلاگ با هدف ارتقاء دانش و آموزش جامعه برنامه‌نویسی و 63 | مهندسان نرم‌افزار تأسیس شده است. در اینجا سعی می‌کنیم به صورت مرتب و منظم، مطالبی را منتشر 64 | کنیم که به کاربران علاقه‌مند در این زمینه‌ها کمک کند و آن‌ها را با تازه‌ترین دانش‌ها و 65 | تکنولوژی‌ها آشنا سازد. هدف ما ایجاد یک محتوای آموزشی، جذاب و مفید است که بتواند در حل مشکلات و 66 | چالش‌های برنامه‌نویسی و تکنولوژی کاربران مؤثر باشد. 67 |

68 |

69 | برنامه‌نویسی یکی از حوزه‌های پرکاربرد و مهم دنیای فناوری اطلاعات است که انواع زبان‌ها و 70 | تکنولوژی‌های مختلفی دارد. با پیشرفت تکنولوژی‌ها و نیازهای روزافزون بازار کار، به‌روز بودن با 71 | آخرین تحولات برنامه‌نویسی ضروری است. این وبلاگ در جهت ارتقاء دانش کاربران و آشنایی آن‌ها با 72 | تکنولوژی‌ها و الگوهای طراحی مختلف تأسیس شده است. 73 |

74 |

75 | موضوعاتی که در این وبلاگ پوشش داده می‌شود شامل برنامه‌نویسی وب، برنامه‌نویسی موبایل، اپلیکیشن‌های 76 | تحت وب، برنامه‌نویسی سمت سرور، امنیت و نگهداری سایت‌ها، طراحی واسط کاربری (UI/UX)، داده‌ها و 77 | بانک‌های اطلاعاتی، چشم‌انداز این حوزه و تحلیل انتخاب رشته در دانشگاه‌ها می‌باشد. ما به دنبال 78 | به‌روزرسانی دائمی مطالب و انتشار محتواهای مفید و کاربردی در این زمینه‌ها هستیم. 79 |

تاریخچه فعالیت‌های من 80 |

بروزرسانی: ۱۸ بهمن ۱۴۰۰ | ساعت ۴:۱۰ ب.ظ

81 |
82 |
83 |
84 |

حمایت مالی (نمونه ۱)

85 |

اگر از محتوای وبلاگ ما لذت می‌برید و می‌خواهید ما را حمایت کنید، می‌توانید با کلیک بر روی دکمه زیر اقدام به اهدای مبلغ دلخواه خود کنید. هر یک از حمایت‌های شما، به ما در ادامه تولید محتوا کمک می‌کند.

86 |
حمایت با PayPalحمایت با Bitcoinحمایت با Ethereumحمایت با Dogecoin
87 |
88 |
89 |

حمایت مالی (نمونه ۲)

90 |

اگر از محتوای وبلاگ ما لذت می‌برید و می‌خواهید ما را حمایت کنید، می‌توانید با کلیک بر روی دکمه زیر اقدام به اهدای مبلغ دلخواه خود کنید. هر یک از حمایت‌های شما، به ما در ادامه تولید محتوا کمک می‌کند.

لینک حمایت مالی 91 |
92 |
93 | 94 | 154 |
155 | 160 | 161 | 162 | -------------------------------------------------------------------------------- /html/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | صفحه اصلی 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 |
28 | 29 |

وبلاگ من

30 |

زیرعنوان وبلاگ من

31 | 49 |
50 |
51 | 52 |
53 |
54 | 55 |
نمونه بج طوسی
56 |

چگونگی بهینه‌سازی وب‌سایت

تصویر مقاله 57 |

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

58 | 59 |

تاریخ انتشار: ۱۹ اسفند ۱۴۰۲ | ساعت ۳:۵۵ ب.ظ | ۱۷ نظر

60 |
61 |
62 | 63 |
نمونه بج قرمز
64 |

راهکارهایی برای بهبود امنیت شبکه

65 |

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

66 | 67 |

تاریخ انتشار: ۱۹ اسفند ۱۴۰۲ | ساعت ۳:۵۵ ب.ظ | ۱۷ نظر

68 |
69 | 76 |
77 | 78 |

تفاوت بین شبکه‌های اجتماعی محبوب در ایران

79 |

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

80 | 81 |

تاریخ انتشار: ۱۹ اسفند ۱۴۰۲ | ساعت ۳:۵۵ ب.ظ | ۱۷ نظر

82 |
83 |
84 | 85 |

آموزش برنامه‌نویسی Python

86 | 89 |

در این مقاله به آموزش برنامه‌نویسی با زبان Python و مباحث مختلف از جمله لیست‌ها، شرط‌ها و حلقه‌ها پرداخته می‌شود.

90 | 91 |

تاریخ انتشار: ۱۹ اسفند ۱۴۰۲ | ساعت ۳:۵۵ ب.ظ | ۱۷ نظر

92 |
93 |
94 | 95 |

آشنایی با برنامه‌نویسی وب

96 | 99 |

در این مقاله به معرفی مفاهیم برنامه‌نویسی وب و استفاده از زبان‌های HTML، CSS و JavaScript برای ساخت صفحات وب پرداخته می‌شود.

100 | 101 |

تاریخ انتشار: ۱۹ اسفند ۱۴۰۲ | ساعت ۳:۵۵ ب.ظ | ۱۷ نظر

102 |
103 |
104 | 105 |

آشنایی با توابع در Python

106 |

در این مقاله به آشنایی با توابع در زبان برنامه‌نویسی Python پرداخته می‌شود. در ادامه، یک نمونه کد Python ارائه می‌شود:

107 | 
def calculate_factorial(n):
108 |     if n == 0:
109 |         return 1
110 |     else:
111 |         return n * calculate_factorial(n-1)
112 | 
113 | num = 5
114 | print("Factorial of", num, "is", calculate_factorial(num))
115 | 116 |

تاریخ انتشار: ۱۹ اسفند ۱۴۰۲ | ساعت ۳:۵۵ ب.ظ | ۱۷ نظر

117 |
118 | 119 | 120 |
121 | 122 | 182 |
183 | 188 | 189 | 190 | -------------------------------------------------------------------------------- /html/podcast-single.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | صفحه پادکست تکی 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 |
28 | 29 |

وبلاگ من

30 |

زیرعنوان وبلاگ من

31 | 49 |
50 |
51 | 52 |
53 | 54 |
خانه > پادکست > اپیزودهای دسته‌بندی تکنولوژی
55 |
56 |

پادکست تکنولوژی | قسمت ۱: چالش‌ها و راهکارهای حفاظت از اطلاعات شخصی در دنیای دیجیتال

تصویر قسمت ۱ 57 | 60 |

در این قسمت به بحث در مورد تکنولوژی X و چگونگی استفاده از آن پرداخته می‌شود.

61 |
گوش دادن در اسپاتیفایگوش دادن در گوگل پادکستگوش دادن در اپل پادکستگوش دادن در کست‌باکس
62 |
63 |
برچسب‌ها:
64 |
65 | 72 | 82 | 83 |

تاریخ انتشار: ۱۹ اسفند ۱۴۰۲ | ساعت ۳:۵۵ ب.ظ | ۱۷ نظر

84 |
85 |

سایر اپیزودها

86 | 90 |
91 |
92 |
93 |

نظرات (۳ نظر)

94 |
95 |

نام کاربری ۱

96 |

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

97 |

تاریخ: ۲۲ بهمن ۱۴۰۰ | ساعت: ۱۲:۰۰ ق.ظ

98 |
99 |
100 |

نام کاربری ۲

101 |

متن مقاله جذاب و روان بود. اطلاعات مفیدی برایم ارائه کردید. ادامه دهید.

102 |

تاریخ: ۲۲ بهمن ۱۴۰۰ | ساعت: ۱:۳۰ ب.ظ

103 |
104 |
105 |

نام کاربری ۳

106 |

واقعا لذت بردم! ممنون بابت این محتواهای ارزشمند.

107 |

تاریخ: ۲۳ بهمن ۱۴۰۰ | ساعت: ۱۰:۴۵ ق.ظ

108 |
109 |
110 |

ثبت نظر

111 |
112 | 113 | 114 | 115 | 116 | 117 |
118 |
119 |
120 |
121 | 122 | 182 |
183 | 188 | 189 | 190 | -------------------------------------------------------------------------------- /html/podcast-list.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | صفحه پادکست 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 |
28 | 29 |

وبلاگ من

30 |

زیرعنوان وبلاگ من

31 | 49 |
50 |
51 | 52 |
53 | 54 |
خانه > پادکست > اپیزودهای دسته‌بندی تکنولوژی
55 |
56 |

پادکست تازه‌های تکنولوژی

57 |
58 |

تصویر نمایه به پادکست "تازه‌های تکنولوژی" خوش آمدید! در این پادکست، به بررسی و بحث درباره آخرین اخبار و تحولات جهان فناوری می‌پردازیم. از تازه‌ترین دستاوردهای علمی تا لحظه‌ی عرضه‌ی دستگاه‌ها و خدمات جدید، همه چیز را درباره دنیای فناوری در این پادکست خواهید شنید. با ما همراه شوید و به دنیایی پر از نوآوری و تحولات عجیب و جذاب سفر کنید.

59 |

با گسترش روزافزون فناوری در تمامی جوانب زندگی، پادکست "تازه‌های تکنولوژی" تصمیم گرفته است تا به شما تجربه‌ای جامع و البته سرگرم‌کننده از اخبار تکنولوژی ارائه دهد. از مبتکران ویژه‌ای که با ابداعاتشان دنیای فناوری را شکل می‌دهند تا تحلیل‌های عمیق در مورد اثرات اجتماعی و اقتصادی تکنولوژی، ما همه جنبه‌های این دنیای پویا را روایت می‌کنیم. هدف ما از این پادکست، به اشتراک گذاشتن اطلاعاتی است که به شما کمک می‌کند تا درک بهتری از چگونگی تأثیر تکنولوژی بر جامعه و زندگی روزمره پیدا کنید.

60 |
اشتراک در کست‌باکس اشتراک در گوگل پادکست اشتراک در اپل پادکست اشتراک در اسپاتیفای
61 |
62 |
63 |
64 |

قسمت ۱: چالش‌ها و راهکارهای حفاظت از اطلاعات شخصی در دنیای دیجیتال

تصویر قسمت ۱ 65 | 68 |

در این قسمت به بحث در مورد تکنولوژی X و چگونگی استفاده از آن پرداخته می‌شود.

69 |
گوش دادن در اسپاتیفایگوش دادن در گوگل پادکستگوش دادن در اپل پادکستگوش دادن در کست‌باکس
70 | 71 |

تاریخ انتشار: ۱۹ اسفند ۱۴۰۲ | ساعت ۳:۵۵ ب.ظ | ۱۷ نظر

72 |
73 |
74 |

قسمت ۲: عنوان قسمت

تصویر قسمت ۲ 75 | 78 |

در این قسمت به بحث در مورد تکنولوژی Y و نقش آن در جامعه پرداخته می‌شود.

79 |
گوش دادن در اسپاتیفایگوش دادن در گوگل پادکستگوش دادن در اپل پادکستگوش دادن در کست‌باکس
80 | 81 |

تاریخ انتشار: ۱۹ اسفند ۱۴۰۲ | ساعت ۳:۵۵ ب.ظ | ۱۷ نظر

82 |
83 |
84 |

قسمت ۳: عنوان قسمت

تصویر قسمت ۳ 85 | 88 |

در این قسمت به بحث در مورد تکنولوژی Z و چالش‌های پیش روی آن پرداخته می‌شود.

89 |
گوش دادن در اسپاتیفایگوش دادن در گوگل پادکستگوش دادن در اپل پادکستگوش دادن در کست‌باکس
90 | 91 |

تاریخ انتشار: ۱۹ اسفند ۱۴۰۲ | ساعت ۳:۵۵ ب.ظ | ۱۷ نظر

92 |
93 | 94 | 95 |
96 | 97 | 157 |
158 | 163 | 164 | 165 | -------------------------------------------------------------------------------- /html/article-list.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | نوشته‌های دسته‌بندی تکنولوژی 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 |
28 | 29 |

وبلاگ من

30 |

زیرعنوان وبلاگ من

31 | 49 |
50 |
51 | 52 |
53 | 54 |
خانه > مقاله‌ها > 55 | لیست نوشته‌های دسته‌بندی تکنولوژی 56 |
57 |
58 | 59 |
نمونه بج طوسی
60 |

چگونگی بهینه‌سازی وب‌سایت

تصویر مقاله 61 |

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

62 | 63 |

تاریخ انتشار: ۱۹ اسفند ۱۴۰۲ | ساعت ۳:۵۵ ب.ظ | ۱۷ نظر

64 |
65 |
66 | 67 |
نمونه بج قرمز
68 |

آموزش برنامه‌نویسی Python

69 | 72 |

در این مقاله به آموزش برنامه‌نویسی با زبان Python و مباحث مختلف از جمله لیست‌ها، شرط‌ها و حلقه‌ها پرداخته می‌شود.

73 | 74 |

تاریخ انتشار: ۱۹ اسفند ۱۴۰۲ | ساعت ۳:۵۵ ب.ظ | ۱۷ نظر

75 |
76 | 83 |
84 | 85 |

تفاوت بین شبکه‌های اجتماعی محبوب در ایران

86 |

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

87 | 88 |

تاریخ انتشار: ۱۹ اسفند ۱۴۰۲ | ساعت ۳:۵۵ ب.ظ | ۱۷ نظر

89 |
90 |
91 | 92 |

راهکارهایی برای بهبود امنیت شبکه

93 |

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

94 | 95 |

تاریخ انتشار: ۱۹ اسفند ۱۴۰۲ | ساعت ۳:۵۵ ب.ظ | ۱۷ نظر

96 |
97 |
98 | 99 |

آشنایی با برنامه‌نویسی وب

100 | 103 |

در این مقاله به معرفی مفاهیم برنامه‌نویسی وب و استفاده از زبان‌های HTML، CSS و JavaScript برای ساخت صفحات وب پرداخته می‌شود.

104 | 105 |

تاریخ انتشار: ۱۹ اسفند ۱۴۰۲ | ساعت ۳:۵۵ ب.ظ | ۱۷ نظر

106 |
107 |
108 | 109 |

آشنایی با توابع در Python

110 |

در این مقاله به آشنایی با توابع در زبان برنامه‌نویسی Python پرداخته می‌شود. در ادامه، یک نمونه کد Python ارائه می‌شود:

111 | 
  
112 |   def calculate_factorial(n):
113 |       if n == 0:
114 |             return 1
115 |        else:
116 |             return n * calculate_factorial(n-1)
117 |   
118 |   num = 5
119 |   print("Factorial of", num, "is", calculate_factorial(num))
120 | 
121 | 
122 |
123 | 124 |

تاریخ انتشار: ۱۹ اسفند ۱۴۰۲ | ساعت ۳:۵۵ ب.ظ | ۱۷ نظر

125 |
126 | 127 | 128 |
129 | 130 | 190 |
191 | 196 | 197 | 198 | -------------------------------------------------------------------------------- /html/about-timeline.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | درباره من - تایملاین 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 |
28 | 29 |

وبلاگ من

30 |

زیرعنوان وبلاگ من

31 | 49 |
50 |
51 | 52 |
53 | 54 |
خانه > 55 | درباره من - تایملاین 56 |
57 |
58 |

درباره من

59 |
60 |

تصویر نمایهاین یک وبلاگ است که به مقالات و مطالب مرتبط با برنامه‌نویسی و تکنولوژی می‌پردازد. ما سعی داریم 61 | اطلاعات مفید و کاربردی را در اختیار کاربران علاقه‌مند به این حوزه قرار دهیم. امیدواریم که 62 | از مطالب ما لذت ببرید و مفید بدانید. این وبلاگ با هدف ارتقاء دانش و آموزش جامعه برنامه‌نویسی و 63 | مهندسان نرم‌افزار تأسیس شده است. در اینجا سعی می‌کنیم به صورت مرتب و منظم، مطالبی را منتشر 64 | کنیم که به کاربران علاقه‌مند در این زمینه‌ها کمک کند و آن‌ها را با تازه‌ترین دانش‌ها و 65 | تکنولوژی‌ها آشنا سازد. هدف ما ایجاد یک محتوای آموزشی، جذاب و مفید است که بتواند در حل مشکلات و 66 | چالش‌های برنامه‌نویسی و تکنولوژی کاربران مؤثر باشد. 67 |

68 |

69 | برنامه‌نویسی یکی از حوزه‌های پرکاربرد و مهم دنیای فناوری اطلاعات است که انواع زبان‌ها و 70 | تکنولوژی‌های مختلفی دارد. با پیشرفت تکنولوژی‌ها و نیازهای روزافزون بازار کار، به‌روز بودن با 71 | آخرین تحولات برنامه‌نویسی ضروری است. این وبلاگ در جهت ارتقاء دانش کاربران و آشنایی آن‌ها با 72 | تکنولوژی‌ها و الگوهای طراحی مختلف تأسیس شده است. 73 |

74 |

بروزرسانی: ۱۸ بهمن ۱۴۰۰ | ساعت ۴:۱۰ ب.ظ

75 |
76 |
77 |
78 |

تاریخچه فعالیت‌های تحصیلی من

79 |
80 |
81 |
82 |

۱۴۰۲ - شروع پایان‌نامه

83 |

آغاز نگارش پایان‌نامه در حوزه [موضوع تحقیقاتی] و تکمیل پروژه‌های مرتبط.

84 |
85 |
86 |
87 |
88 |

۱۴۰۱ - تخصص در توسعه وب

89 |

مطالعه پیشرفته JavaScript و فریمورک‌های مدرن مانند ReactJS برای توسعه اپلیکیشن‌های تحت وب.

90 |
91 |
92 |
93 |
94 |

۱۴۰۰ - پروژه دانشگاهی با Python

95 |

انجام اولین پروژه تحقیقاتی دانشگاهی با استفاده از Python و Django در حوزه [موضوع پروژه].

96 |
97 |
98 |
99 |
100 |

۱۳۹۹ - شروع تحصیلات دانشگاهی

101 |

آغاز دوره کارشناسی در رشته [نام رشته] و گذراندن دروس پایه مرتبط با علوم کامپیوتر.

102 |
103 |
104 |
105 |
106 |

۱۳۹۸ - آمادگی برای دانشگاه

107 |

مطالعه منابع علمی و شرکت در دوره‌های آنلاین برای تقویت مهارت‌های برنامه‌نویسی.

108 |
109 |
110 |
111 |
112 |

تاریخچه پروژه‌های من

113 |
114 |
115 |
116 |

۱۳۹۷ - اولین اسکریپت خودکارسازی

117 |

توسعه یک اسکریپت ساده با Python برای پردازش داده‌های متنی و یادگیری اصول برنامه‌نویسی.

118 |
119 |
120 |
121 |
122 |

۱۳۹۹ - توسعه اولین وب‌اپلیکیشن

123 |

طراحی و پیاده‌سازی یک سیستم مدیریت وظایف با Django و Python، شامل احراز هویت کاربران و پایگاه داده SQL.

124 |
125 |
126 |
127 |
128 |

۱۴۰۰ - ساخت اولین اپلیکیشن SPA با React

129 |

یادگیری و توسعه یک اپلیکیشن تک‌صفحه‌ای (SPA) با ReactJS برای نمایش داده‌های پویا و تعامل کاربر.

130 |
131 |
132 |
133 |
134 |

۱۴۰۱ - پیاده‌سازی API اختصاصی

135 |

طراحی یک FastAPI برای مدیریت داده‌های کاربران، ارائه سرویس‌های RESTful و ادغام با پایگاه داده NoSQL.

136 |
137 |
138 |
139 |
140 |

۱۴۰۲ - توسعه و انتشار وبلاگ شخصی

141 |

ایجاد و بهینه‌سازی یک وبلاگ با استفاده از Next.js و بهینه‌سازی برای SEO و تجربه کاربری.

142 |
143 |
144 |
145 |
146 |

۱۴۰۳ - پروژه مدیریت مالی شخصی

147 |

توسعه یک داشبورد مدیریت مالی با قابلیت تحلیل هزینه‌ها، درآمد و ارائه نمودارهای تعاملی.

148 |
149 |
150 |
151 |
152 | 153 | 213 |
214 | 219 | 220 | 221 | -------------------------------------------------------------------------------- /html/article-single.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | نوشته تک 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 |
28 | 29 |

وبلاگ من

30 |

زیرعنوان وبلاگ من

31 | 49 |
50 |
51 | 52 |
53 | 54 |
خانه > مقاله‌ها > 55 | لیست نوشته‌های دسته‌بندی تکنولوژی 56 |
57 |
58 | 59 |

آموزش برنامه‌نویسی وب

تصویر مقاله 60 |

در این مقاله به آموزش برنامه‌نویسی وب با استفاده از زبان‌های HTML، CSS و JavaScript پرداخته می‌شود. این آموزش شامل مفاهیم مختلفی از جمله تعریف صفحات وب با HTML، استایل دهی به صفحات با CSS و اضافه کردن افکت‌ها و تعاملات با استفاده از JavaScript می‌باشد.

61 |

نمونه متن قرار گرفته در تگ h1

62 |

نمونه متن قرار گرفته در تگ h2

63 |

نمونه متن قرار گرفته در تگ h3

64 |

نمونه متن قرار گرفته در تگ h4

65 |
نمونه متن قرار گرفته در تگ h5
66 |

تصویر نمونه

تصویر آموزش 67 |

آموزش صوتی

68 | 71 |

شما می‌توانید این آموزش صوتی را برای گوش دادن به مباحث آموزش برنامه‌نویسی وب با استفاده از زبان‌های مختلف مانند HTML، CSS و JavaScript استفاده کنید.

72 |

آموزش ویدئویی

73 | 76 |

شما می‌توانید این آموزش ویدئویی را ببینید تا بهتر و قدم به قدم نحوه کدنویسی و اجرای برنامه‌های وب را یاد بگیرید.

77 |

کد نمونه - HTML و CSS

78 | 
  <!DOCTYPE html>
 79 |   <html>
 80 |   <head>
 81 |       <title>صفحه وب نمونه</title>
 82 |       <link rel="stylesheet" href="style.css">
 83 |   </head>
 84 |   <body>
 85 |       <h1>این یک صفحه وب نمونه است</h1>
 86 |       <p>این یک متن نمونه است که به عنوان توضیح در صفحه قرار می‌گیرد.</p>
 87 |   </body>
 88 |   </html>
89 |

این کد نمونه، یک صفحه وب ساده با استفاده از زبان‌های HTML و CSS را نشان می‌دهد. با اجرای این کد در مرورگر، شما یک صفحه وب ساده با یک عنوان و یک پاراگراف متنی خواهید داشت.

90 |

کد نمونه - JavaScript

91 | 
  // JavaScript Sample Code
 92 |   function greet(name) {
 93 |       return "Hello, " + name + "!";
 94 |   }
 95 | 
 96 |   var user = "John";
 97 |   var message = greet(user);
 98 |   console.log(message);
99 |

این کد نمونه نشان می‌دهد چگونه از زبان برنامه‌نویسی JavaScript برای تعریف تابع ساده‌ای استفاده کنید و از آن در کنسول مرورگر خروجی بگیرید.

100 | 101 |
102 |
برچسب‌ها:
103 | 110 |
111 | 112 | 123 | 124 |

تاریخ انتشار: ۱۹ اسفند ۱۴۰۲ | ساعت ۳:۵۵ ب.ظ | ۱۷ نظر

125 | 126 |
127 |

نوشته‌های مشابه (حالت ساده)

128 | 133 |
134 |
135 | 136 |
137 |

نوشته‌های مشابه (حالت کارت)

138 |
139 |

آموزش پیشرفته CSS

140 |

در این مقاله به تکنیک‌ها و ترفندهای پیشرفته در CSS پرداخته می‌شود...

141 |
142 | 146 | 147 |
148 | 149 |
150 |

نظرات (۳ نظر)

151 |
152 |

نام کاربری ۱

153 |

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

154 |

تاریخ: ۲۲ بهمن ۱۴۰۰ | ساعت: ۱۲:۰۰ ق.ظ

155 |
156 |
157 |

نام کاربری ۲

158 |

متن مقاله جذاب و روان بود. اطلاعات مفیدی برایم ارائه کردید. ادامه دهید.

159 |

تاریخ: ۲۲ بهمن ۱۴۰۰ | ساعت: ۱:۳۰ ب.ظ

160 |
161 |
162 |

نام کاربری ۳

163 |

واقعا لذت بردم! ممنون بابت این محتواهای ارزشمند.

164 |

تاریخ: ۲۳ بهمن ۱۴۰۰ | ساعت: ۱۰:۴۵ ق.ظ

165 |
166 | 167 |
168 |

ثبت نظر

169 |
170 | 171 | 172 | 173 | 174 | 175 |
176 |
177 |
178 |
179 | 180 | 240 |
241 | 246 | 247 | 248 | -------------------------------------------------------------------------------- /html/assets/style.css: -------------------------------------------------------------------------------- 1 | /* Import fonts from Google Fonts */ 2 | @import url('https://fonts.googleapis.com/css2?family=Vazirmatn&display=swap'); 3 | @import url('https://fonts.googleapis.com/css2?family=Courier+New&display=swap'); 4 | @import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css'); 5 | 6 | /* Apply the following styles to all elements */ 7 | * { 8 | margin: 0; 9 | padding: 0; 10 | box-sizing: border-box; 11 | /* Use the 'Vazirmatn' font for all text */ 12 | font-family: 'Vazirmatn', sans-serif; 13 | } 14 | 15 | /* Set the background color and font size for the body element */ 16 | body { 17 | background-color: #f2f2f2; 18 | font-size: 16px; 19 | } 20 | 21 | /* Style the header element */ 22 | header { 23 | background-color: #333; 24 | color: #fff; 25 | padding: 1rem; 26 | text-align: center; 27 | } 28 | 29 | /* Style for the main heading in the header */ 30 | header h1 { 31 | font-size: 1.6rem; 32 | margin: .9rem; 33 | font-weight: 400; 34 | } 35 | 36 | /* Style for the secondary heading in the header */ 37 | header h2 { 38 | font-size: 1rem; 39 | color: #666; 40 | margin-bottom: 1rem; 41 | } 42 | 43 | a { 44 | text-decoration: none; 45 | color: #333; 46 | } 47 | 48 | a:hover { 49 | color: #666; 50 | } 51 | 52 | /* Style the navigation list */ 53 | nav ul { 54 | list-style: none; 55 | margin: 0; 56 | padding: 0; 57 | font-size: 0.96rem; 58 | } 59 | 60 | /* Style the navigation list items */ 61 | nav li { 62 | display: inline-block; 63 | margin: 0 0.5rem; 64 | } 65 | 66 | /* Style the navigation links */ 67 | nav a { 68 | color: #fff; 69 | } 70 | 71 | /* Style the navigation links on hover */ 72 | nav a:hover { 73 | border-bottom: 2px solid #fff; 74 | color: #fff; 75 | } 76 | 77 | 78 | /* Style the dropdown menu */ 79 | .dropdown-content { 80 | display: none; 81 | position: absolute; 82 | background-color: #333; 83 | min-width: 160px; 84 | box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); 85 | z-index: 1; 86 | } 87 | 88 | .dropdown-content a{ 89 | padding: 12px 0; 90 | text-decoration: none; 91 | display: block; 92 | } 93 | 94 | .dropdown-content a:hover { 95 | border-bottom: none; 96 | } 97 | 98 | .dropdown-content li { 99 | display: block; 100 | } 101 | 102 | .dropdown:hover .dropdown-content { 103 | display: block; 104 | } 105 | 106 | 107 | 108 | /* Style headings */ 109 | h1 { 110 | font-size: 1.3rem; 111 | margin-bottom: 1.1rem; 112 | font-weight: bold; 113 | } 114 | 115 | h2 { 116 | font-size: 1.2rem; 117 | margin-bottom: 1rem; 118 | font-weight: bold; 119 | } 120 | 121 | 122 | h3 { 123 | font-size: 1.1rem; 124 | margin-bottom: 0.9rem; 125 | font-weight: bold; 126 | } 127 | 128 | h4 { 129 | font-size: 1rem; 130 | margin-bottom: 0.8rem; 131 | font-weight: bold; 132 | } 133 | 134 | h5 { 135 | font-size: 0.9rem; 136 | margin-bottom: 0.7rem; 137 | font-weight: bold; 138 | } 139 | 140 | 141 | /* Breadcrumb Styles */ 142 | .breadcrumb { 143 | font-size: 0.8rem; 144 | margin: 0 1rem 1rem 0; 145 | color: #333; 146 | } 147 | 148 | .container { 149 | display: flex; 150 | flex-wrap: wrap; 151 | justify-content: space-between; 152 | max-width: 1200px; 153 | margin: 0 auto; 154 | padding: 2rem; 155 | } 156 | 157 | /* Style the main content area */ 158 | main { 159 | flex: 0 0 calc(100% - 200px - 2rem); 160 | max-width: calc(100% - 200px - 2rem); 161 | margin-left: 2rem; 162 | } 163 | 164 | .sidebar { 165 | width: 200px; 166 | } 167 | 168 | 169 | /* Style the sidebar card titles */ 170 | .sidebar-card-title { 171 | border-bottom: 1px dashed #c1c2c3; 172 | margin-bottom: 0.5rem; 173 | padding-bottom: 0.5rem; 174 | margin-right: -6px; 175 | font-size: 0.85rem; 176 | color: #666; 177 | } 178 | 179 | .sidebar .card a { 180 | font-size: 0.82rem; 181 | } 182 | 183 | 184 | /* Card */ 185 | .card { 186 | background-color: #fff; 187 | padding: 2rem; 188 | margin-bottom: 2rem; 189 | box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1); 190 | } 191 | 192 | 193 | 194 | /* Style the article paragraphs */ 195 | p, article p { 196 | font-size: 0.9rem; 197 | line-height: 1.8; 198 | color: #555; 199 | margin: 1rem 0; 200 | } 201 | 202 | /* Style the article image */ 203 | article img { 204 | width: 100%; 205 | max-width: 100%; 206 | filter: grayscale(100%); 207 | transition: filter 0.5s ease; 208 | } 209 | 210 | article img:hover { 211 | filter: grayscale(0); 212 | } 213 | 214 | /* Style the audio and video elements */ 215 | article audio, 216 | article video { 217 | display: block; 218 | width: 100%; 219 | margin: 1rem 0; 220 | } 221 | 222 | /* Style the pre block */ 223 | pre { 224 | direction: ltr; 225 | padding: 0 !important; 226 | background-color: #f7f7f7 !important; 227 | border: 1px solid #ddd; 228 | border-radius: 4px; 229 | margin: .5rem !important; 230 | white-space: pre-wrap !important; 231 | } 232 | 233 | /* Style the code snippet inside the pre block */ 234 | pre code { 235 | font-family: 'Courier New', monospace !important; 236 | /* font-family: Consolas,Monaco,'Andale Mono','Ubuntu Mono',monospace !important; */ 237 | } 238 | 239 | 240 | .comments-section { 241 | margin-top: 2rem; 242 | padding-top: 1rem; 243 | border-top: 1px solid #ccc; 244 | } 245 | 246 | /* Style the article info */ 247 | .article-info, .comment-info { 248 | font-size: 0.75rem; 249 | color: #888; 250 | margin-top: 0.7rem; 251 | } 252 | 253 | /* Style the footer element */ 254 | footer { 255 | background-color: #f2f2f2; 256 | color: #5c5c5c; 257 | font-size: 0.9rem; 258 | text-align: center; 259 | padding: 1rem; 260 | } 261 | 262 | /* Style the footer paragraphs */ 263 | footer p { 264 | margin: 0.5rem 0; 265 | } 266 | 267 | footer a { 268 | color: #000; 269 | font-weight: 500; 270 | text-decoration: none; 271 | } 272 | 273 | /* Style the last footer paragraph */ 274 | footer p:last-of-type { 275 | font-size: 0.75rem; 276 | margin: 0; 277 | padding: 0; 278 | } 279 | 280 | 281 | 282 | 283 | .card { 284 | background-color: #fff; 285 | padding: 1rem; 286 | margin-bottom: 2rem; 287 | box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1); 288 | } 289 | 290 | .card ul { 291 | list-style: none; 292 | margin: 0; 293 | padding: 0; 294 | } 295 | 296 | 297 | 298 | /* Common styles for all social media boxes */ 299 | .social-icons{ 300 | margin-bottom: 2rem; 301 | } 302 | 303 | .social-box { 304 | width: 100%; 305 | height: 48px; 306 | color: #fff; 307 | align-items: center; 308 | justify-content: center; 309 | text-align: center; 310 | border-radius: 8px; 311 | display: flex; 312 | align-items: center; 313 | justify-content: center; 314 | text-align: center; 315 | margin: 0.3rem 0; 316 | filter: grayscale(100%); 317 | transition: filter 0.5s ease; 318 | } 319 | 320 | .social-box-small { 321 | display: inline-block; 322 | width: calc(33% - 6px); 323 | height: 56px; 324 | border-radius: 8px; 325 | font-size: 1.8rem; 326 | color: #fff; 327 | text-align: center; 328 | margin: 5px 3px ; 329 | padding: 8px; 330 | filter: grayscale(100%); 331 | transition: background-color 0.3s ease; 332 | } 333 | 334 | .social-box:hover, .social-box-small:hover { 335 | filter: grayscale(0); 336 | color: #fff; 337 | } 338 | 339 | /* Styles for each social media box */ 340 | .twitter { 341 | background-color: #1da1f2; 342 | } 343 | 344 | .telegram { 345 | background-color: #0088cc; 346 | } 347 | 348 | .youtube { 349 | background-color: #ff0000; 350 | } 351 | 352 | .instagram { 353 | background-color: #e4405f; 354 | } 355 | 356 | .mastadon { 357 | background-color: #6364FF; 358 | } 359 | 360 | .castbox { 361 | background-color: #f3734e; 362 | } 363 | 364 | .github { 365 | background-color: #6364FF; 366 | } 367 | 368 | /* Additional styles for the Contact page form */ 369 | form { 370 | display: flex; 371 | flex-direction: column; 372 | max-width: 400px; 373 | margin: 0 auto; 374 | } 375 | 376 | label { 377 | margin-top: 1rem; 378 | } 379 | 380 | input, 381 | textarea { 382 | padding: 0.5rem; 383 | margin: 0.5rem 0; 384 | } 385 | 386 | button { 387 | background-color: #333; 388 | color: #fff; 389 | padding: 0.5rem 1rem; 390 | border: none; 391 | cursor: pointer; 392 | } 393 | 394 | button:hover { 395 | background-color: #555; 396 | } 397 | 398 | 399 | 400 | /* Style the about text and photo */ 401 | .about-text { 402 | min-height: 220px; 403 | } 404 | 405 | .about-photo { 406 | border-radius: 50%; 407 | width: 180px; 408 | height: 180px; 409 | object-fit: cover; 410 | float: left; 411 | margin: 0.5rem; 412 | } 413 | 414 | 415 | 416 | /* Style the donation section buttons */ 417 | .donation-buttons { 418 | display: flex; 419 | flex-wrap: wrap; 420 | justify-content: space-between; 421 | margin-top: 1rem; 422 | } 423 | 424 | .donation-button { 425 | background-color: #333; 426 | color: #fff; 427 | padding: 0.5rem; 428 | border: none; 429 | font-size: 1rem; 430 | border-radius: 4px; 431 | margin-top: 1rem; 432 | flex: 0 0 calc(49% - 10px); 433 | text-align: center; 434 | } 435 | 436 | /* Style the donation buttons on hover */ 437 | .donation-button:hover { 438 | background-color: #444; 439 | color: #fff; 440 | } 441 | 442 | /* Style the specific donation buttons */ 443 | .paypal { 444 | background-color: #009cde; 445 | } 446 | 447 | .bitcoin { 448 | background-color: #f7931a; 449 | } 450 | 451 | .ethereum { 452 | background-color: #48cbd9; 453 | } 454 | 455 | .dogecoin { 456 | background-color: #ba9f33; 457 | } 458 | 459 | 460 | 461 | /* Gallery styles */ 462 | .gallery { 463 | display: grid; 464 | grid-template-columns: repeat(2, 1fr); 465 | gap: 2rem; 466 | 467 | } 468 | 469 | .photo { 470 | position: relative; 471 | overflow: hidden; 472 | filter: grayscale(100%); 473 | transition: filter 0.5s ease; 474 | } 475 | 476 | .photo:hover { 477 | filter: grayscale(0); 478 | } 479 | 480 | .photo img { 481 | width: 100%; 482 | vertical-align: middle; 483 | } 484 | 485 | .caption { 486 | position: absolute; 487 | bottom: 0; 488 | left: 0; 489 | width: 100%; 490 | padding: 1rem; 491 | color: #fff; 492 | background: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.8) 100%); 493 | } 494 | 495 | .caption h3, .caption p { 496 | margin: 0; 497 | padding: 0; 498 | } 499 | 500 | .caption h3 { 501 | font-size: 1.2rem; 502 | font-weight: bold; 503 | margin-bottom: 0.5rem; 504 | } 505 | 506 | .caption p { 507 | font-size: 0.7rem; 508 | color: #fff; 509 | } 510 | 511 | 512 | 513 | /* Style the tags list */ 514 | .tags-list { 515 | list-style: none; 516 | padding: 0; 517 | margin: 0; 518 | font-size: 0.8rem; 519 | } 520 | 521 | .sidebar .tags-list { 522 | text-align: center; 523 | } 524 | 525 | /* Style each tag */ 526 | .tags-list li { 527 | display: inline-block; 528 | margin: 0.5rem 0.1rem; 529 | } 530 | 531 | /* Style the link inside the tag */ 532 | .tags-list li a { 533 | background-color: #f1f3f4; 534 | color: #555; 535 | padding: 0.3rem 0.7rem; 536 | border-radius: 10px; 537 | text-decoration: none; 538 | } 539 | 540 | /* Style the link on hover */ 541 | .tags-list li a:hover { 542 | background-color: #eaeaea; 543 | } 544 | 545 | 546 | 547 | 548 | 549 | 550 | 551 | 552 | /* Article Tags and Share Buttons */ 553 | .article-tags, 554 | .share-buttons { 555 | margin-top: 2rem; 556 | } 557 | 558 | .article-tags h3, 559 | .share-buttons h3 { 560 | font-size: 1.2rem; 561 | margin-bottom: 1rem; 562 | } 563 | 564 | .article-tags .tags-list, 565 | .share-buttons .social-list { 566 | list-style: none; 567 | padding: 0; 568 | margin: 0; 569 | display: flex; 570 | flex-wrap: wrap; 571 | } 572 | 573 | .article-tags .tags-list li, 574 | .share-buttons .social-list li { 575 | margin: 0.5rem 0.5rem 0.5rem 0; 576 | } 577 | 578 | .article-tags .tags-list li a, 579 | .share-buttons .social-list li a { 580 | background-color: #f1f3f4; 581 | color: #555; 582 | padding: 0.3rem 0.7rem; 583 | border-radius: 10px; 584 | text-decoration: none; 585 | } 586 | 587 | 588 | /* simple related articles */ 589 | .related-articles-list{ 590 | margin: 1rem; 591 | } 592 | 593 | /* Style for related articles section */ 594 | .related-articles { 595 | margin-top: 2rem; 596 | padding-top: 1rem; 597 | border-top: 1px solid #ccc; 598 | } 599 | 600 | .related-article { 601 | margin-bottom: 1.2rem; 602 | } 603 | 604 | .related-article p { 605 | margin: 0; 606 | } 607 | 608 | 609 | 610 | /* Share Buttons */ 611 | .social-list { 612 | list-style: none; 613 | padding: 0; 614 | margin: 0; 615 | display: flex; 616 | flex-wrap: wrap; 617 | } 618 | 619 | .social-list li { 620 | margin: 0.5rem 0.5rem 0.5rem 0; 621 | } 622 | 623 | .social-list li a { 624 | background-color: #f1f3f4; 625 | color: #555; 626 | padding: 0.3rem 0.7rem; 627 | border-radius: 10px; 628 | text-decoration: none; 629 | display: flex; 630 | align-items: center; 631 | justify-content: center; 632 | width: 40px; 633 | height: 40px; 634 | font-size: 1.2rem; 635 | } 636 | 637 | .social-list li a:hover { 638 | background-color: #eaeaea; 639 | } 640 | 641 | 642 | /* error pages */ 643 | .error { 644 | text-align: center; 645 | margin-top: 200px; 646 | margin-left: 0; 647 | max-width: 100%; 648 | } 649 | 650 | .error h1 { 651 | font-size: 1.4rem; 652 | margin: 0.8rem 0; 653 | } 654 | 655 | .error p { 656 | font-size: 1rem; 657 | margin: 0.8rem 0; 658 | } 659 | 660 | 661 | 662 | /* faq */ 663 | .faq-item { 664 | margin-bottom: 20px; 665 | } 666 | 667 | .question { 668 | cursor: pointer; 669 | } 670 | 671 | .answer { 672 | display: none; 673 | margin-top: 10px; 674 | padding: 10px; 675 | background-color: #f7f7f7; 676 | border-radius: 5px; 677 | } 678 | 679 | .answer p { 680 | margin: 0; 681 | } 682 | 683 | .question.active { 684 | font-weight: bold; 685 | } 686 | 687 | .question.active + .answer { 688 | display: block; 689 | } 690 | 691 | 692 | /* Podcast episode buttons */ 693 | .podcast-buttons { 694 | margin-top: 1rem; 695 | display: flex; 696 | flex-wrap: wrap; 697 | } 698 | 699 | /* Styling for podcast and subscribe buttons */ 700 | .podcast-buttons a { 701 | background-color: #333; 702 | color: #fff; 703 | padding: 0.4rem 0.7rem; 704 | font-size: 0.8rem; 705 | border-radius: 4px; 706 | margin: 0.3rem; 707 | text-align: center; 708 | transition: background-color 0.3s ease; 709 | } 710 | 711 | .podcast-buttons a:hover { 712 | background-color: #555; 713 | } 714 | 715 | /* Styling for each service's brand color on hover */ 716 | .podcast-buttons .castbox:hover { 717 | background-color: #FF6F00; /* Castbox brand color */ 718 | } 719 | 720 | .podcast-buttons .google-podcast:hover { 721 | background-color: #4285f4; /* Google Podcasts brand color */ 722 | } 723 | 724 | .podcast-buttons .apple-podcast:hover { 725 | background-color: #9933CC; /* Apple Podcasts brand color */ 726 | } 727 | 728 | .podcast-buttons .spotify:hover { 729 | background-color: #1db954; /* Spotify brand color */ 730 | } 731 | 732 | .podcast-buttons i { 733 | font-size: 1rem; 734 | 735 | } 736 | 737 | 738 | /* Pagination styles */ 739 | .pagination { 740 | margin: 1.5rem; 741 | text-align: center; 742 | font-size: 0.8rem; 743 | } 744 | 745 | .page-link { 746 | display: inline-block; 747 | margin: 0 0.3rem; 748 | padding: 0.3rem 0.5rem; 749 | background-color: #f1f3f4; 750 | color: #555; 751 | border-radius: 5px; 752 | border: 1px solid #ccc; 753 | transition: background-color 0.3s ease; 754 | } 755 | 756 | .page-link:hover { 757 | background-color: #eaeaea; 758 | } 759 | 760 | .page-link.active { 761 | background-color: #333; 762 | color: #fff; 763 | } 764 | 765 | /* Gray Badge */ 766 | .gray-badge { 767 | float: left; 768 | background-color: #b6b6b6; 769 | color: #fff; 770 | padding: 0.2rem 0.5rem; 771 | border-radius: 0.5rem; 772 | font-size: 0.8rem; 773 | } 774 | 775 | /* Red Badge */ 776 | .red-badge { 777 | float: left; 778 | background-color: #ff0000; 779 | color: #fff; 780 | padding: 0.2rem 0.5rem; 781 | border-radius: 0.5rem; 782 | font-size: 0.8rem; 783 | } 784 | 785 | 786 | 787 | /* Medium screens */ 788 | @media screen and (min-width: 768px) and (max-width: 992px) { 789 | 790 | 791 | .container{ 792 | padding: 0.7rem; 793 | } 794 | 795 | main { 796 | flex: 0 0 calc(100% - 200px - 0.7rem); 797 | max-width: calc(100% - 200px - 0.7rem); 798 | margin-left: 0.7rem; 799 | } 800 | 801 | .card { 802 | margin-bottom: 0.7rem; 803 | } 804 | 805 | form { 806 | max-width: 100%; 807 | } 808 | } 809 | 810 | /* Mobile and Tablet */ 811 | @media (max-width: 768px) { 812 | .container{ 813 | padding: 0.7rem; 814 | } 815 | 816 | main { 817 | flex: 0 0 100%; 818 | max-width: 100%; 819 | margin-left: 0; 820 | } 821 | 822 | .sidebar { 823 | flex: 0 0 100%; 824 | max-width: 100%; 825 | } 826 | 827 | .card { 828 | margin-bottom: 0.7rem; 829 | } 830 | 831 | form { 832 | max-width: 100%; 833 | } 834 | 835 | .donation-button, .social-box { 836 | font-size: 0.8rem; 837 | } 838 | 839 | .social-box { 840 | font-size: 0.9rem; 841 | } 842 | 843 | .podcast-buttons a { 844 | margin: 0.2rem; 845 | } 846 | 847 | .gallery { 848 | grid-template-columns: repeat(1, 1fr); 849 | gap: 1rem; 850 | } 851 | 852 | 853 | 854 | 855 | } 856 | 857 | 858 | /* Timeline container */ 859 | .timeline { 860 | position: relative; 861 | max-width: 96%; 862 | margin: 24px 0; 863 | padding: 12px 0; 864 | } 865 | 866 | .timeline::before { 867 | content: ""; 868 | position: absolute; 869 | left: 50%; 870 | width: 6px; 871 | background: #717171; 872 | top: 0; 873 | bottom: 0; 874 | margin-left: -3px; 875 | border-radius: 3px; 876 | } 877 | 878 | 879 | .timeline-item { 880 | position: relative; 881 | width: 50%; 882 | padding: 1rem .3rem; 883 | box-sizing: border-box; 884 | } 885 | 886 | .timeline-item:nth-child(odd) { 887 | right: 50%; 888 | text-align: right; 889 | } 890 | 891 | .timeline-item:nth-child(odd) .timeline-content { 892 | text-align: right; 893 | } 894 | 895 | .timeline-item:nth-child(even) { 896 | right: 0; 897 | text-align: left; 898 | } 899 | 900 | .timeline-item:nth-child(even) .timeline-content { 901 | text-align: left; 902 | } 903 | 904 | .timeline-content { 905 | background: #fff; 906 | padding: 1rem; 907 | border-radius: 6px; 908 | position: relative; 909 | box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1); 910 | /* width: 90%; */ 911 | } 912 | 913 | .timeline-content p { 914 | margin: 0; 915 | font-size: .8rem; 916 | } 917 | 918 | .timeline-content h3 { 919 | margin-bottom: .2rem; 920 | font-size: .9rem; 921 | } 922 | 923 | 924 | 925 | .timeline-item::before { 926 | content: ''; 927 | position: absolute; 928 | top: 36px; 929 | width: 16px; 930 | height: 16px; 931 | background: #717171; 932 | border-radius: 50%; 933 | left: 100%; 934 | transform: translateX(-50%); 935 | z-index: 99; 936 | } 937 | 938 | .timeline-item:nth-child(even)::before { 939 | left: 0; 940 | transform: translateX(-50%); 941 | } 942 | 943 | /* Responsive timeline */ 944 | @media screen and (max-width: 768px) { 945 | .timeline { 946 | max-width: 100%; 947 | } 948 | 949 | .timeline-item { 950 | width: calc(100% - 40px); 951 | left: 0; 952 | text-align: left; 953 | padding-left: 0rem; 954 | } 955 | 956 | .timeline-item:nth-child(odd) { 957 | right: 50px; 958 | } 959 | 960 | .timeline-item::before { 961 | display: none; 962 | } 963 | 964 | .timeline-content { 965 | width: calc(100% - 2rem); 966 | } 967 | 968 | .timeline::after { 969 | left: 20px; 970 | } 971 | } 972 | 973 | /* PrismJS 1.29.0 974 | https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript+markup-templating+php+python */ 975 | code[class*=language-],pre[class*=language-]{color:#000;background:0 0;text-shadow:0 1px #fff;font-family:Consolas,Monaco,'Andale Mono','Ubuntu Mono',monospace;font-size:1em;text-align:left;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}code[class*=language-] ::-moz-selection,code[class*=language-]::-moz-selection,pre[class*=language-] ::-moz-selection,pre[class*=language-]::-moz-selection{text-shadow:none;background:#b3d4fc}code[class*=language-] ::selection,code[class*=language-]::selection,pre[class*=language-] ::selection,pre[class*=language-]::selection{text-shadow:none;background:#b3d4fc}@media print{code[class*=language-],pre[class*=language-]{text-shadow:none}}pre[class*=language-]{padding:1em;margin:.5em 0;overflow:auto}:not(pre)>code[class*=language-],pre[class*=language-]{background:#f5f2f0}:not(pre)>code[class*=language-]{padding:.1em;border-radius:.3em;white-space:normal}.token.cdata,.token.comment,.token.doctype,.token.prolog{color:#708090}.token.punctuation{color:#999}.token.namespace{opacity:.7}.token.boolean,.token.constant,.token.deleted,.token.number,.token.property,.token.symbol,.token.tag{color:#905}.token.attr-name,.token.builtin,.token.char,.token.inserted,.token.selector,.token.string{color:#690}.language-css .token.string,.style .token.string,.token.entity,.token.operator,.token.url{color:#9a6e3a;background:hsla(0,0%,100%,.5)}.token.atrule,.token.attr-value,.token.keyword{color:#07a}.token.class-name,.token.function{color:#dd4a68}.token.important,.token.regex,.token.variable{color:#e90}.token.bold,.token.important{font-weight:700}.token.italic{font-style:italic}.token.entity{cursor:help} --------------------------------------------------------------------------------