Content Studio — Posts
CONTENT STUDIO SUB-PAGE · WRITTEN POSTS

Written Posts

Content Studio/written-posts/ · Content Storage/written-posts/

A blog-style collection of written articles and posts covering engineering concepts, tech tutorials, personal reflections, and educational topics. Supports Markdown rendering, bilingual (Bengali/English) toggle, reading time estimate, and category filtering.

Engineering, tech tutorials, personal reflections এবং educational topics নিয়ে articles। Markdown rendering, bilingual toggle (বাংলা/English), reading time estimate এবং category filter সহ।

Markdown Bilingual Reading Time Category Tags Blog Posts Search
Written Posts
Understanding Signal Processing with MATLAB
A. K. Islam · 5 min read · Engineering
Signal processing is a fundamental skill for engineers. In this post we explore…
EN
বাংলা
SECTION 01

Post Listing & Blog Grid

The posts listing page shows articles as styled blog cards with cover image, title, excerpt, reading time, publish date, and category tags. Filtering by category and searching by keyword updates the grid in real-time.

Posts listing page-এ blog card grid। Cover image, title, excerpt, reading time, date ও tags সহ। Category filter এবং keyword search real-time কাজ করে।

Article Card Grid
Responsive grid of post cards with cover image, excerpt, tags, and reading time
Category Filtering
Filter by topic: Engineering, AI, Tutorial, Opinion, Personal — instant update
Reading Time Estimate
Automatically calculated from word count — shown on each post card
Post Cards
Arduino Interrupt Tutorial
4 min · Engineering · 2024
AI Prompt Engineering Tips
7 min · AI · 2024
SECTION 02

Markdown Rendering

Posts are written in Markdown and rendered to styled HTML. The renderer supports headings, bold/italic, code blocks with syntax highlighting, inline code, blockquotes, tables, and image embeds — all with the site's dark red aesthetic.

Posts Markdown-এ লেখা, styled HTML-এ render হয়। Headings, code blocks (syntax highlighting), tables, images সব support করে।

Syntax-highlighted Code Blocks
Fenced code blocks with language detection and dark red themed highlighting
Blockquotes & Tables
Styled callout blockquotes and responsive markdown tables
Image Embeds
Markdown image syntax renders full-width with optional caption below
Markdown Output
Understanding PID Control
A proportional–integral–derivative controller...
float kp = 1.2, ki = 0.5;
error = setpoint - feedback;
SECTION 03

Bilingual Toggle

Posts can be written in both Bengali and English, stored in separate Markdown files. A toggle button on the post page switches the displayed language instantly without reloading. The active language preference is saved per session.

Posts বাংলা ও English দুটি ভাষায় লেখা যায়। Post page-এ একটি toggle button ভাষা switch করে — page reload ছাড়াই। Language preference session-এ save থাকে।

EN / বাংলা Toggle
Instantly switches between English and Bengali versions of the same post
Session Language Memory
Selected language is remembered for the session — stays consistent across posts
Dual Markdown Files
Each post has post-en.md and post-bn.md in the storage folder
Language Toggle
EN
বাংলা
Signal processing covers the analysis, synthesis, and modification of signals. A signal is simply data that changes over time...
SECTION 04 · NEW FEATURES V2.0

Advanced Formatting Tools

The post editor now includes 10 powerful formatting features to create richer content: emoji picker, callout boxes, video embeds, text highlighting, task lists, collapsible sections, tables, and an integrated help modal with step-by-step guides.

Post editor-এ এখন ১০টি নতুন formatting feature: emoji picker, callout boxes, video embeds, text highlighting, task lists, collapsible sections, tables ও integrated help guide সহ।

Emoji Picker
4-category emoji picker (Smileys, Symbols, Objects, Flags) with 100+ emojis and search filter
Integrated Help Modal
Comprehensive in-editor guide with toolbar features, keyboard shortcuts, examples, and best practices
Task Lists (GFM)
GitHub-style checkboxes (- [ ] / - [x]) rendered with custom styling and red accent
Callout Boxes
Smart blockquotes with INFO / WARNING / SUCCESS / ERROR keywords for colored alert boxes
Video Embed Helper
Auto-detects YouTube & Vimeo URLs and generates responsive iframe embeds with poster frames
Text Highlighting
Markdown syntax ==highlighted text== renders with yellow background mark element
Collapsible Sections
HTML5 <details>/<summary> with animated arrow and hover effects
Enhanced Table Builder
Visual table editor modal for creating markdown tables with custom rows/columns
Image Insert (Dual Mode)
Upload images or insert by URL — with alt text and caption support
Syntax-highlighted Code
Fenced code blocks with language detection, one-click copy, and highlight.js integration
Editor Toolbar
==Highlighted text==
> [!WARNING] Be careful
- [ ] Task item

Written Posts — File Reference

FileTypeDescription
Content Studio/written-posts/FolderPost listing, post detail, and post reader HTML pages
Content Storage/written-posts/StorageMarkdown files (post-en.md, post-bn.md) and images for each post
Written-posts listing pagePageBlog grid with search, category filter, reading time — reads JSON manifest
Post detail / reader pagePageRenders Markdown, shows bilingual toggle, reading progress, related posts
Posts manifest JSONDataLists all posts: slug, title, date, category, reading time, language availability