This is that list, plus an honest section on --dangerously-skip-permissions, which is the flag everyone wants to know about and almost nobody uses correctly.

How commands work in Claude Code

Inside a session, type / to see every command available, or type / followed by a few letters to filter. A command is only recognized at the very start of your message; anything after the command name is passed as arguments.

Two things to know up front. First, slash commands and skills now use the same system. The official commands reference splits them into “built-in commands” (behavior coded into the CLI, like /clear and /model) and “bundled skills” (prompt-driven, like /simplify and /debug), but you invoke both the same way. If you put a file at .claude/commands/deploy.md or a skill at .claude/skills/deploy/SKILL.md, both create /deploy.

Second, not every command shows up for every user. Availability depends on your plan, OS, and environment. /desktop only shows on macOS and Windows when you’re signed in with a Claude subscription. /upgrade only shows on Pro and Max plans. If a command in this post isn’t there for you, that’s why.

Everything below is from the official commands reference and the permissions docs, tested against Claude Code 2.1.142.

The ones I run constantly

These are the ten or so commands that earn their muscle memory.

Context management: /clear, /compact, /context

/clear starts a new conversation with an empty context. The previous one stays available in /resume. Pass an optional name (/clear notes) to label the previous conversation in the resume picker so it’s easier to find later. Aliases: /reset, /new.

/compact [instructions] is different. It keeps the same conversation but summarizes it to free up context. Pass focus instructions if you want the summary biased toward something specific. Use this when you’re mid-task and the context bar is getting hot.

/context shows current context usage as a colored grid, with suggestions for what’s eating the most. I use it whenever a session starts feeling sluggish to figure out which tool or memory file is bloating things.

Sessions: /resume, /branch, /rewind

/resume [session] (alias /continue) jumps back into a previous conversation. With no argument, it opens a picker.

/branch [name] creates a branch of the current conversation at this point. You can explore one approach, then /resume back to the branch point and try a different one without losing the original. Alias: /fork. (If you set the CLAUDE_CODE_FORK_SUBAGENT env var, /fork instead spawns a forked subagent and stops being an alias for /branch.)

/rewind is checkpointing. Roll back the conversation, the code, or both, to a previous point, or summarize from a selected message. Aliases: /checkpoint, /undo. This one feels weird the first time and indispensable after.

Models and effort: /model, /effort

/model [model] switches the model for the session. With no argument, it opens a picker.

/effort [level] controls how much reasoning the model uses. Accepts low, medium, high, xhigh, max, or ultracode. max and ultracode are session-only, and the available levels depend on the model you’re on. ultracode is a Claude Code setting that pairs xhigh reasoning with automatic workflow orchestration. Run with no argument to get an interactive slider. Both of these take effect immediately, without waiting for the current response to finish, which is the kind of small detail you only appreciate after living without it.

Diffs and reviews: /diff, /review, /security-review

/diff opens an interactive diff viewer for uncommitted changes and per-turn diffs. Left and right arrows switch between the current git diff and individual Claude turns; up and down browse files. This is what I use to actually read what just happened before I trust it.

/review [PR] reviews a pull request locally in the current session. For deeper cloud-based reviews there’s /code-review ultra (with /ultrareview remaining as an alias), which includes 3 free runs on Pro and Max before tapping usage credits and isn’t something Claude can launch on its own.

/security-review analyzes pending changes on the current branch for things like injection, auth issues, and data exposure. Worth running before any PR that touches request handling.

File access: /permissions, /add-dir

/permissions (alias /allowed-tools) opens an interactive dialog for managing allow, ask, and deny rules. You can view rules by scope, add or remove them, and review recent auto-mode denials. This is the single command most worth learning if you want to stop being prompted for the same Bash variations forty times a day.

/add-dir <path> adds a working directory for file access during the current session. Worth knowing: most .claude/ configuration in the added directory is not loaded as configuration, just as files. The exceptions are skills in .claude/skills/, which do get picked up with live reload.

The ones worth knowing exist

These don’t earn daily slots, but they’re the ones I reach for when the situation calls for them.

• /init initializes a project with a CLAUDE.md guide. Set CLAUDE_CODE_NEW_INIT=1 for an interactive flow that also walks through skills, hooks, and personal memory files.
• /memory edits CLAUDE.md files, enables or disables auto-memory, and views auto-memory entries.
• /agents manages subagent configurations.
• /plan [description] enters plan mode directly from the prompt. Pass a description to start with that task immediately, like /plan fix the auth bug.
• /goal [condition] is a newer one I’ve been enjoying. Set a condition (“all tests pass,” “every endpoint returns 401 for unauthenticated requests,” “no TypeScript errors”) and Claude keeps working across turns until it’s met. With no argument, it shows the current or most recently achieved goal. Pass clear, stop, off, reset, none, or cancel to drop an active goal early. What I like about it is the simplicity: it just keeps working until the thing you asked for is done.
• /simplify [target] is a bundled skill that reviews recently changed files for reuse, simplification, efficiency, and whether the change sits at the right level of abstraction, then applies the fixes. Four review agents run in parallel and their findings get aggregated.
• /debug [description] enables debug logging for the current session and troubleshoots issues by reading the session debug log. Worth knowing that debug logging is off by default unless you started with claude --debug, so running /debug mid-session captures logs from that point forward, not earlier.
• /loop [interval] [prompt] runs a prompt repeatedly while the session stays open. Omit the interval and Claude self-paces. Example: /loop 5m check if the deploy finished.
• /schedule [description] (alias /routines) creates, updates, lists, or runs scheduled remote agents. Useful for the “remind me to clean up that feature flag in two weeks” pattern.
• /usage (aliases /cost, /stats) shows session cost, plan usage limits, and activity stats. On Pro, Max, Team, or Enterprise plans, it also breaks down usage by skill, subagent, plugin, and MCP server.
• /export [filename] exports the current conversation as plain text. With a filename, writes directly; without, opens a copy/save dialog.
• /copy [N] copies the last assistant response to the clipboard. Pass N to copy the Nth latest. With code blocks present, you get an interactive picker. Press w in the picker to write the selection to a file instead, which is genuinely useful over SSH.
• /mcp manages MCP server connections and OAuth.
• /plugin manages plugins. /reload-plugins reloads all active plugins to apply pending changes without restarting.
• /doctor diagnoses your Claude Code installation. Press f to have Claude fix any reported issues.
• /insights analyzes your sessions and reports on project areas, interaction patterns, and friction points.

The dangerous one

Now the section everyone scrolls to: --dangerously-skip-permissions.

This is a CLI flag, not a slash command. You start a session with it:

claude --dangerously-skip-permissions

It puts the session in bypassPermissions permission mode, which skips all the per-tool approval prompts. No more “Allow Bash to run npm install?” No more accept-edit dialog. Claude just goes.

There’s also a related flag, --allow-dangerously-skip-permissions, that doesn’t enable bypass mode but allows it as an option (so you can flip into it with --permission-mode bypassPermissions later). Anthropic recommends the latter only for sandboxes with no internet access.

What it actually skips

According to the permissions documentation, bypassPermissions mode skips all permission prompts, including writes to .git, .claude, .vscode, .idea, and .husky. Those are the directories most people assume are protected and aren’t.

That means if you’re running this in a real project, Claude can rewrite your local git history, edit your editor settings, modify your husky hooks, and overwrite your own .claude/ config without asking. None of those will trigger a prompt.

What it doesn’t skip

There is one circuit breaker. Removals targeting the filesystem root or your home directory, like rm -rf / or rm -rf ~, still prompt regardless of the mode. The docs frame this as a guard against model error, not user error. So you’re not going to wipe your machine in a single tool call without seeing a dialog first.

Hooks are also still respected. A PreToolUse hook that exits with code 2 still blocks the call. So if you have your own guardrails wired up, they keep working.

When I actually use it

My honest take: with a strong model like Claude Opus 4.7, this flag is more usable than its name implies. Opus is unlikely to wander off and do something catastrophic on its own. I do run sessions with bypass mode on for routine work where I’m watching what’s happening, and the friction reduction is real.

The risk isn’t the model freelancing. The risk is one bad prompt from you. Ask Claude to “clean up that directory” ambiguously, drop bypass on, and you can lose work. Tell it to “reset the database” without specifying which one, and it’ll happily run the destructive command against whatever connection your local env is pointed at. Worst case, a single typo or unclear instruction in a bypass session can delete files you care about, drop a database, or do something genuinely worse if the session has access to production credentials. The flag removes the safety net that would have caught any of that.

So a better framing than “never use it” is: use it with a strong model, in a project where you’ve thought about the blast radius, and only after you trust yourself to write prompts that are unambiguous about destructive operations. The rules I run with:

• Don’t run bypass mode in a directory holding uncommitted work I’d hate to lose.
• Don’t run bypass mode in any session that has access to a production database, S3 bucket, or live API key.
• Never paste a prompt I haven’t read carefully into a bypass session.
• Anthropic’s own recommendation, “isolated environments like containers or VMs where Claude Code cannot cause damage,” is still the safest bar to hit when the project allows it.

If those constraints don’t fit a particular project, the lower-risk paths below get you most of the friction reduction without the full liability:

• /permissions to allow specific commands you trust. Spend ten minutes setting up Bash(npm run *), Bash(git status *), Bash(jest *), and the prompts go away.
• The /fewer-permission-prompts skill, which scans your transcripts for common read-only Bash and MCP calls and adds a prioritized allowlist to your project’s .claude/settings.json.
• /sandbox to toggle sandbox mode (on supported platforms). When sandboxing is enabled with autoAllowBashIfSandboxed: true (the default), sandboxed Bash commands run without prompting. The sandbox boundary substitutes for the per-command prompt, which is a much safer trade than blanket bypass.
• acceptEdits mode, which auto-accepts file edits and common filesystem commands like mkdir, touch, mv, and cp for paths in your working directory. Most of the friction without most of the risk.

How orgs lock it down

If you run a team and don’t want anyone using bypass mode, set permissions.disableBypassPermissionsMode to "disable" in managed settings. That blocks the mode regardless of what individual users put in their own settings. The --dangerously-skip-permissions flag will still parse, but the mode won’t activate. Worth setting if Claude Code is going on company laptops with access to anything sensitive.

Custom commands are just skills now

If you find yourself pasting the same instructions into chat, or your CLAUDE.md file has grown a section that’s really a procedure, that procedure should be a skill.

The minimum is a directory with a SKILL.md file. Drop it at ~/.claude/skills/<name>/SKILL.md for personal use across every project, or .claude/skills/<name>/SKILL.md for a single project. The directory name becomes the command. Add YAML frontmatter with a description, and Claude can also load the skill automatically when the description matches what you’re asking.

A useful pattern is the ! prefix to inject live shell output into a skill before Claude reads it:

---
description: Summarize uncommitted changes and flag risky ones.
---

## Current changes

!`git diff HEAD`

## Instructions

Summarize the diff in two or three bullets. Flag missing error handling, hardcoded values, or tests that need updating.

When you run /summarize-changes, Claude Code runs git diff HEAD first, replaces the placeholder with the output, and only then sends the prompt. The instructions arrive with the actual diff already inlined.

The full reference is in the skills documentation. I built a few of these for the WordPress sites I run, and the time savings vs pasting the same checklist into chat are real.

Skills worth installing

The good thing about skills being a shared format is you don’t have to write your own to benefit. There’s now a directory at skills.sh where developers publish reusable skills for Claude Code, Cursor, Cline, and other agents. A few I keep installed:

• color-expert by meodai. Color naming, theory, palettes, ramps, gradients, conversions, accessibility. The kind of knowledge I don’t want to keep re-explaining to an agent every time I’m picking colors.
• emil-design-eng by Emil Kowalski. Encodes Emil’s philosophy on UI polish, component design, animation decisions, and the small details that make software feel good. If you’ve ever stared at one of Emil’s components on Twitter and wondered how he gets motion to feel that way, this is the closest thing to a transferable answer.
• make-interfaces-feel-better by Jakub Krehel. Design engineering principles for hover states, micro-interactions, and the kind of polish that takes a UI from working to nice.

If you want to find more, skills.sh itself has a find-skills skill you can install that helps you discover others when you describe what you’re trying to do. Mildly recursive but useful.

Quick reference

If you just want the categorical list:

• Context tools: /clear, /compact, /context
• Sessions: /resume, /branch, /rewind
• Model and effort: /model, /effort, /fast
• Reviewing changes: /diff, /review, /security-review, /ultrareview
• Permissions and access: /permissions, /add-dir, /sandbox
• Project setup: /init, /memory, /agents, /skills, /hooks
• Workflow: /plan, /goal, /loop, /schedule, /simplify, /debug, /fewer-permission-prompts
• Visibility: /usage, /insights, /status, /doctor
• Output: /copy, /export, /recap
• Integrations: /mcp, /plugin, /reload-plugins, /install-github-app, /install-slack-app
• Session UI: /theme, /color, /focus, /tui, /statusline
• The dangerous flag, CLI only: --dangerously-skip-permissions

That’s not all of them. The complete list is in the official commands reference, and it changes often enough that I’d check it before relying on anything not covered here.

The post Claude Code Commands: The Ones I Actually Use appeared first on Andy Feliciotti.

We see a lot of bogus signups on RightBlogger for people trying to abuse our free tier. So I thought I would share some of my best tips and insights.

In this post, I’ll show you how to block disposable emails using JavaScript with a few API calls. This runs server-side, so your API keys stay private. No matter your programming language, some of the tips here will still apply.

This method is useful if you want to keep things clean and prevent users from abusing sign-ups with throwaway accounts. Let’s get into it.

Full Code Snippet to Block Disposable Emails

Since you’re here for the code, here’s the full snippet I use to check for disposable emails with a few API calls:

How it Works

The snippet runs three checks in sequence. Each API catches different things, so combining them covers more ground than any single check would.

Debounce.io (free): Checks whether the email domain is a known disposable provider. Get a free API key at debounce.io. No credit card required.

VerifyMail.io (optional, paid): A secondary check that confirms whether the domain is associated with throwaway addresses. Useful if you want extra coverage beyond Debounce. Sign up at verifymail.io.

StopForumSpam (free): Cross-references the email and IP against a database of known spammers. No API key needed. It’s especially good at catching repeat abusers who rotate disposable emails but reuse the same IP.

One thing worth knowing: running three sequential API calls adds a small delay at signup. If latency matters to you, run Debounce and StopForumSpam in parallel with Promise.all() and only call VerifyMail as a fallback. Most signups get flagged by one of the free checks anyway.

Additional Checks for Users Signing Up

Even with these APIs, people are persistent. Here are a few more things you can layer into your signup flow.

• Limit Sign-Ups per IP: Allowing up to two sign-ups per IP per week cuts down on repeat abuse from the same person. You can set this up easily with an Upstash Rate Limit.
• Restrict Dot Variations: Some people create multiple accounts by adding dots in Gmail addresses (like an.d.y.f@gmail.com). Counting periods and blocking emails with three or more can help cut down on abuse. You can also normalize all Gmail addresses by removing the periods before the @ symbol, but make sure your login/signup flows account for this so no one gets locked out.
• Watch for ‘+’: Users might add “+something” to the end of their email (e.g., andy+test@gmail.com). Stripping the “+” and everything after it gives you the base email for deduplication. I wouldn’t block + usage outright since plenty of people use it legitimately, but it’s worth normalizing before you store or check the address.

Is It Worth the Setup?

None of this stops every bad signup. Determined users will find workarounds, and new disposable email providers pop up faster than any blocklist can track them. But you don’t need perfection. Cutting out 80-90% of throwaway signups is enough to make your free tier sustainable and your user data actually useful. Since Debounce and StopForumSpam are both free, the only real cost is an hour of implementation. If fake accounts are eating into your product, that’s an easy tradeoff.

The post How to Block Disposable Emails with JavaScript (Code Snippet) appeared first on Andy Feliciotti.

In this post I’ll show you how to grab metadata for a webpage using Node.js and Cheerio. With these tools, you can fetch and parse metadata from any web page.

Full Code Snippet

Since you’re likely here for code, here’s my full code for grabbing meta title, description, and og:image using Node and Cheerio. Install Cheerio first if you haven’t already:

npm install cheerio

Why Server-Side JavaScript?

You can’t fetch another site’s HTML from the browser. Cross-origin security restrictions block those requests unless the target site explicitly allows it, which most don’t. Running the fetch server-side sidesteps this entirely.

Node.js handles async HTTP requests well and deploys easily anywhere. The script works as a Cloudflare Worker, a Vercel serverless function, or any standard Node server without changes.

Explaining the Code

Importing Cheerio

Cheerio parses raw HTML on the server using jQuery-style selectors. It’s fast, lightweight, and has no browser dependencies. One thing to know upfront: Cheerio doesn’t execute JavaScript. It only reads the HTML the server returns. For most sites that’s fine since meta tags are in the static HTML, but more on that in the error section.

Validating the URL

Before fetching anything, we need a proper URL. If the URL doesn’t start with “http://” or “https://”, we prepend “https://” to it. I found this to be a simple way to improve the experience. If you want to be more thorough, use isURL from the Validator package, but for most cases the basic check is enough.

Fetching the HTML

With the URL ready, we fetch the page HTML using the Fetch API. Note that some sites block automated requests by checking the User-Agent header or running Cloudflare bot protection. For a personal project or low-volume tool this works fine. For higher-volume use, you’ll want a rotating proxy or a service like ScrapingBee.

Parsing HTML with Cheerio

Once we have the raw HTML, Cheerio loads it into a DOM-like structure we can query with selectors.

Extracting Metadata

With the DOM ready, we pull three fields:

• Title: Grabs the <title> tag text.
• Description: Checks <meta name="description"> first, then falls back to <meta property="og:description">.
• Image: Checks <meta property="og:image"> first, then falls back to <meta name="twitter:image">.

Any field that’s missing defaults to an empty string. Here’s what a successful result looks like:

{
  "title": "Example Domain",
  "description": "This domain is for illustrative examples.",
  "image": "https://example.com/og-image.png"
}

One thing to watch: og:image values are sometimes relative paths rather than absolute URLs. If you’re displaying the image in your app, check whether it starts with “http” and resolve it against the page’s base URL if not.

Navigating Errors Gracefully

The function wraps everything in a try/catch. If the fetch fails or the HTML is unparseable, it logs the error and returns an empty metadata object. This keeps your app from crashing when it hits an unreachable or malformed URL.

One limitation worth knowing: this won’t work for single-page applications that inject meta tags with JavaScript after page load. Cheerio only sees the raw HTML from the server. If a site’s <title> or meta description is set by React or Vue on the client, you’ll get empty strings back. For those cases you’d need a headless browser like Puppeteer.

Wiring It Up as an API Endpoint

The function is meant to run on a server, not in the browser. Here’s how to expose it as an API route in Next.js so your frontend can call it:

// app/api/meta/route.js
import { getMetaData } from '@/lib/getMetaData';

export async function GET(request) {
  const { searchParams } = new URL(request.url);
  const url = searchParams.get('url');

  if (!url) {
    return Response.json({ error: 'url parameter required' }, { status: 400 });
  }

  const meta = await getMetaData(url);
  return Response.json(meta);
}

Then call it from your frontend:

const res = await fetch(`/api/meta?url=${encodeURIComponent(inputUrl)}`);
const meta = await res.json();

If you’re on Cloudflare Workers the pattern is the same, just swapping in Cloudflare’s request handler format.

Wrapping It Up

For most link preview use cases, this approach works well. Cheerio is lightweight, the setup is minimal, and the fallback logic handles the messiness of real-world HTML. The main edge case is JavaScript-rendered sites. If those make up a big portion of your URLs, reach for Puppeteer instead. Otherwise this is a solid starting point and has worked well in production for Meta Preview Tool.

The post Grab Meta Tags (Title/Description) from Sites with Node.js appeared first on Andy Feliciotti.

Repurposing videos as blog posts gets your content in front of readers who skip YouTube, helps your site rank in search, and squeezes more value from work you’ve already done. In this post I’ll show you exactly how to do it.

Why Repurpose YouTube Videos for Blog Posts

Reach New Readers and Viewers

Not everyone watches videos. Some people prefer to read, search, and skim. Turning your videos into blog posts puts your content in front of an audience that would never find you on YouTube alone.

This matters especially for content marketing. A blog gives you more control over the experience than social media does. You can collect email addresses, run promotions, and build a direct relationship with readers, all things that are harder to do through YouTube alone.

Boost Your Blog’s Search Engine Traffic

Blog posts created from your videos can rank in search and bring new readers to your site. It’s worth doing keyword research before you publish so the post targets a real search term rather than just mirroring your video title.

Picking the Perfect Videos for Your Blog

Not every video converts well into a blog post. A vlog works better in video format. Choose content that stands on its own in text.

Evergreen Content

Pick videos that keep getting views long after they’re published. Those are the posts that will also rank in Google over time.

Tutorial and How-To Videos

Tutorial videos are ideal for conversion. They have clear step-by-step structure that translates directly into a blog post, and you can pull screenshots from the video to use as illustrations without any extra work.

How to Convert YouTube Videos to Blog Posts

Here’s the step-by-step process for turning a YouTube video into a blog post using AI.

Step 1: Get The Transcript

First you’ll need to grab a YouTube video transcript. This is where all the rich content of a video lives and what we’ll use to build the blog post.

YouTube offers transcripts for most videos built in. You can also use RightBlogger’s transcript downloader with a free account to copy the full transcript in one click.

Click the more button on any video to find the “show transcript” button. This brings up a sidebar with the full transcript.

After the transcript appears you’ll notice timestamps next to each line. You don’t want those, so click the “…” button and toggle the timestamps off.

Once the timestamps are gone, highlight all the text and copy it. If you only want part of the video, copy just the relevant sections. This works well for long videos like podcasts where you want to blog about a single segment.

If a video doesn’t have a transcript, use a service like Rev to create one. Rev is one of my favorite paid options since it delivers captions and subtitles back to YouTube automatically.

On a Mac, MacWhisper transcribes videos locally and outputs a .SRT file you can upload to YouTube or LinkedIn. I’ve found the transcriptions better than YouTube’s auto-captions.

RightBlogger also has an AI video and audio transcription tool if you’d rather handle everything in one place.

Once you have the transcript copied, head over to ChatGPT to generate a blog post outline.

Step 2: Outline with AI Help

Use ChatGPT to turn your transcript into a blog post outline. Here’s a prompt template to get started. I’d also recommend adding “The primary keyword of my article is [keyword]” at the top if you’re targeting a specific search term, which helps shape the structure around what people are actually searching for.

Act as a blogger who is great at writing. Help me write a blog post outline based on a YouTube video. I am going to give you the video transcript so you can turn it into an outline for me to write a blog post. Use Markdown so it's easier to read.

YouTube Video Transcript:
[PASTE YOUTUBE VIDEO TRANSCRIPT HERE]

ChatGPT will convert the transcript into a structured outline. You can then ask it to write each section, but don’t just copy and paste the raw output. You’ll want to edit it and add your own voice before publishing.

Step 3: Edit Your Post

Copy the content from ChatGPT into your blog CMS and start editing. The AI-generated outline keeps you on track while leaving room for your exact writing style.

Don’t have a blog yet? Learn how to start one. A blog gives you full control over your audience, lets you grow an email list, and ranks in search in ways YouTube alone can’t.

This step is where you add what AI can’t: specific details, your actual opinions, screenshots pulled from the video, and internal links to other posts on your site. Embedding the original video in the post is also a good move, serving both readers and viewers from one page.

Google has been clear that AI content designed to game the algorithm gets removed from search. Read over everything, refine it, and make sure the post sounds like you wrote it.

Step 4: SEO Optimize Your Post

Before publishing, run through these SEO basics:

• Title and meta description: Include your primary keyword in both. A WordPress SEO plugin like Yoast or RankMath makes this straightforward to manage.
• URL slug: Keep it short and keyword-focused. Trim any auto-generated slugs that are a long string of words.
• Alt text on images: Every screenshot you pull from the video should have descriptive alt text, not just the filename or “image”.
• Internal links: Link to related posts on your site where it fits naturally. This helps both readers and search engines understand your content.

I wrote a full breakdown of WordPress SEO tips if you want to go deeper on any of these.

Skip the Manual Steps with RightBlogger

If you’d rather skip the manual process, I built a YouTube to blog post converter on RightBlogger that handles everything from a single URL. Paste in your video link and it generates a full post. You pick the article length, writing style, language, and primary keyword, and can add custom instructions on top. RightBlogger is a blog automation platform built for content creators who want to grow traffic without doubling their workload.

The bigger time-saver is the autoblogging feature. Connect RightBlogger to your YouTube channel and it automatically converts new uploads to blog posts, no manual work after the initial setup. I put together a full guide on how to automate your blog that walks through the whole setup if you want to see how it works end to end.

FAQs about Converting YouTube Videos to Blog Posts

What if the YouTube video doesn’t have a transcript?

If the video doesn’t have a transcript, use a third-party service like Rev or MacWhisper to create one. Most videos have an auto-generated YouTube transcript, but newly uploaded and very old videos sometimes don’t. Some tools, including RightBlogger’s transcription tool, can generate a transcript directly from a YouTube link without needing to download anything first.

How do I make longer blogs?

Getting AI to write longer posts consistently takes a bit of structure:

• Generate the outline first, then prompt the AI to write each section separately and tell it which section you’re working on.
• Add a word requirement in the prompt, like “Write at least 700 words.” This works better on more capable models and tends to fall short on lighter ones like GPT-5.4 mini.
• Set a minimum word count per section in your outline prompt so the AI knows what you’re expecting from the start.

Writing each section separately is the most reliable way to hit a longer overall word count.

How do I export blogs to my website?

Copy and paste the output from ChatGPT directly into your CMS (WordPress, Webflow, Squarespace, etc.). If the formatting isn’t coming through cleanly, add “Respond with Markdown” to your prompt. This ensures headings, bullet points, and bold text carry over as expected.

What if the transcript is too long?

If the transcript hits the AI’s context limit, here are your options:

• Use GPT-5.4, Claude, or Gemini. All three have large context windows and most transcripts won’t come close to exceeding them.
• Only paste the section of the transcript you actually want to blog about.
• Summarize the transcript first with RightBlogger’s summarizer, then use the summary to generate your outline.

What are some video to blog tools?

Here are paid and free options to help convert videos to articles:

• Video To Blog: Free video to blog tool to generate articles from YouTube videos.
• RightBlogger: Paid tool suite for bloggers and YouTubers that includes a video to blog converter and full autoblogging.
• RyRob Video to Blog Tool: Free converter to quickly turn videos into blog posts.
• Video To Blog AI: Paid service with advanced options including automatic video screenshots.

Conclusion

Repurposing YouTube videos as blog posts is one of the smartest moves a content creator can make. You’ve already done the hard work of researching, scripting, and recording. Turning that into a post takes a fraction of the time and puts your content in front of an entirely different audience.

Do it manually with the steps above, or connect RightBlogger to your channel and let it run on autopilot. Either way, your videos are too valuable to live in just one place.

The post How to Convert YouTube Videos to Blog Posts Using AI appeared first on Andy Feliciotti.

To get a transparent hex code for any color, find the opacity percentage in the table below and append it to your hex color. Red (#FF0000) at 50% opacity becomes #FF000080. For a fully transparent hex code, use any color followed by 00, such as #00000000.

Using Hex Opacity in CSS

You can apply hex opacity to any CSS property that accepts a color value: backgrounds, borders, text, box shadows, and more. Just append the two-digit hex value to any existing color code.

/* Background with 50% opacity */
background-color: #0000FF80;

/* Text color at 70% opacity */
color: #333333B3;

/* Border at 25% opacity */
border: 1px solid #FF000040;

/* Box shadow with transparency */
box-shadow: 0 4px 6px #00000033;

CSS also supports a 4-digit shorthand format (#RGBA), where each digit is doubled. So #0F08 is the same as #00FF0088. This shorthand only works when each pair of digits is identical, so it’s less commonly used than the full 8-digit format.

One platform difference worth knowing: Android and Kotlin use the reversed format #AARRGGBB, where the alpha comes first. The table below still applies for the alpha portion; just swap its position when writing Android color values.

Hex Opacity Table

Here is a handy table to quickly find the opacity hex code to append to your hex color.

For example, to get 95% opacity, append F2 to your hex color. Red at 95% opacity: #ff0000f2.

The hex values use standard mathematical rounding (rounding 0.5 up). So 50% maps to 80 (128 in decimal, since 127.5 rounds up) rather than 7F (127). Some tools use truncation instead and show 7F for 50% and 3F for 25%. Both are valid CSS values. The visual difference is imperceptible.

Hex Opacity vs. rgba() and the opacity Property

Three CSS approaches handle color transparency. They’re not interchangeable.

#RRGGBBAA hex notation applies transparency to a single color value. It works anywhere a color is accepted in CSS. The downside is readability: #FF000080 isn’t as clear as rgba(255, 0, 0, 0.5) at a glance.

rgba() and hsla() are the more readable alternatives. The alpha channel uses a 0-1 decimal (0.5 for 50%), so no hex conversion is needed. Both rgba() and 8-digit hex produce identical results; they’re different syntax for the same thing.

The CSS opacity property works differently. Setting opacity: 0.5 on an element makes the entire element transparent, including its children. Text inside a semi-transparent container will inherit the parent’s opacity. To keep text fully visible while making only the background transparent, use background-color with hex opacity or rgba() instead.

/* These produce identical results */
background-color: #FF000080;
background-color: rgba(255, 0, 0, 0.5);

/* This makes the entire element AND its children 50% transparent */
opacity: 0.5;

Understanding the Hexadecimal System

Decimal is base 10: digits run from 0 to 9. Hexadecimal is base 16, so it adds six more symbols: A, B, C, D, E, and F. That gives each digit position 16 possible values instead of 10.

A single hex digit represents values from 0 to F, where F equals 15 in decimal. Two hex digits together cover 0 to 255 (FF in hex). That range is why the opacity channel fits in exactly two characters.

Valid two-digit hex values include 00, 01, 99, 9D, CC, E4, and F5. Letters are case-insensitive in CSS, so #ff0000f2 and #FF0000F2 are the same color.

Browser Support

8-digit hex color notation is well-supported across all modern browsers. CSS #RRGGBBAA notation has had broad support since 2016 in Chrome and Firefox, and since 2019 in all major browsers including Safari. If you need to support Internet Explorer, use rgba() instead.

The post Hex Opacity: What is it & hex opacity table appeared first on Andy Feliciotti.

Full disclosure: I built this API to simplify getting accurate sunrise and sunset times in apps and websites. It localizes times to the location you query, auto-adjusts for terrain elevation, and now returns moon and sun-position data in every response. No API key, no signup.

Using the SunriseSunset.io API

The base request needs just a latitude and longitude. Drop them into a URL and you get JSON back:

https://api.sunrisesunset.io/json?lat=38.907192&lng=-77.036873

No authentication. Times are returned in the local timezone of the coordinates you pass.

What you get back

Every response includes more than just sunrise and sunset. Here’s the shape of a typical result:

{
  "results": {
    "date": "2026-04-04",
    "sunrise": "6:48:29 AM",
    "sunset": "7:36:01 PM",
    "first_light": "5:16:33 AM",
    "last_light": "9:07:57 PM",
    "dawn": "6:21:29 AM",
    "dusk": "8:03:01 PM",
    "solar_noon": "1:12:15 PM",
    "golden_hour": "7:00:44 PM",
    "day_length": "12:47:32",
    "nautical_twilight_begin": "5:49:31 AM",
    "nautical_twilight_end": "8:34:59 PM",
    "timezone": "America/New_York",
    "utc_offset": -240,
    "sun_altitude": 56.81,
    "sun_azimuth": 180.33,
    "sunrise_azimuth": 82,
    "sunset_azimuth": 278.38,
    "moonrise": "9:38:28 PM",
    "moonset": "7:48:47 AM",
    "moon_illumination": 92.7,
    "moon_phase": "Waning Gibbous",
    "moon_phase_value": 0.59,
    "elevation": 26
  },
  "status": "OK",
  "tzid": "America/New_York"
}

If you only need sunrise and sunset, ignore the rest. If you’re building for photographers, hikers, climbers, or anyone who cares about golden hour, twilight, or moon phase, it’s already in the response.

Basic JavaScript example

You can get coordinates for any location by right-clicking on Google Maps and copying the lat/lng.

Here is a basic fetch using the coordinates of the Gateway Arch in St. Louis:

// Coordinates for Gateway Arch in St. Louis
const lat = 38.624519738607894;
const lng = -90.18581515692256;
const url = `https://api.sunrisesunset.io/json?lat=${lat}&lng=${lng}`;

fetch(url)
  .then(res => res.json())
  .then(({ results, status }) => {
    if (status !== 'OK') {
      console.error('API error:', status);
      return;
    }
    console.log(`Sunrise: ${results.sunrise}`);
    console.log(`Sunset:  ${results.sunset}`);
  })
  .catch(err => console.error('Network error:', err));

A fuller example on CodePen renders the same data to the page.

Useful parameters

Date and date ranges

Pass date=YYYY-MM-DD, date=today, or date=tomorrow for a single date. To grab a range, use date_start and date_end. You can request up to 365 days of data in one call:

https://api.sunrisesunset.io/json?lat=38.62&lng=-90.19&date_start=2026-06-01&date_end=2026-06-07

Time format

Pass time_format=24 for 24-hour times, time_format=military, or time_format=unix for UTC timestamps. The default is 12-hour with AM/PM.

ISO 8601 output

If you want machine-parseable timestamps instead of strings like "6:48:29 AM", pass formatted=0. The response switches to ISO 8601, and day_length comes back as seconds.

Elevation

Sunrise and sunset are automatically adjusted for the terrain elevation at the requested coordinates. Higher elevations give an earlier sunrise and a later sunset, which matters more than people expect for mountain or coastal locations. Pass elevation=false to disable the adjustment, or pass a value in meters (like elevation=1609) to override the detected value.

Timezone

Times return in the location’s local timezone by default. Pass timezone=Europe/Paris (any tz database name) to force a different zone.

JSONP

If you need to call the API from a browser environment that requires JSONP, pass callback=yourFunctionName and the response will be wrapped accordingly.

Status codes

The API returns a specific status field you can branch on:

• OK for a successful request
• INVALID_REQUEST for malformed parameters
• INVALID_DATE for a bad date format
• INVALID_TZID for an unrecognized timezone
• UNKNOWN_ERROR if something fails server-side

One edge case worth knowing: at extreme latitudes near the poles, sunrise or sunset may not exist on a given day. In those cases the corresponding field returns null rather than a time string. Check for it if your app might be queried for arctic or antarctic coordinates.

What to build with it

A few patterns the API gets used for:

• Photography apps showing golden hour, blue hour, and twilight for a chosen location
• Outdoor reservation sites that need to know whether a booking is in daylight
• Local business pages displaying sunset times to give visitors context
• Smart home dashboards triggering events around solar noon or civil twilight
• Travel sites comparing day length and sunset azimuth across destinations
• Astronomy apps using moon phase and illumination data for planning

A few less obvious uses I’ve seen people build:

• Astrophotography planning. Use the nautical twilight times and moon_illumination to find true dark windows when the moon isn’t washing out the sky.
• Wedding ceremony timing. Pair golden_hour with sunset_azimuth to recommend a ceremony time and orient the altar so the sunset frames the couple.
• Drone shows and fireworks. Trigger the first launch once last_light passes a threshold, so the sky is actually dark enough for the show to land.
• Solar panel installations. Use sun_altitude and sun_azimuth at solar noon, combined with the auto-detected elevation, to recommend roof tilt and orientation for a given address.
• Hiking trail safety. Compare last_light against the hiker’s estimated return time and warn before they commit to a leg they can’t finish in daylight.
• Trick-or-treat timers. Ping parents when civil twilight starts on October 31st in their location so they know it’s officially dark enough.
• Religious observance apps. Compute Islamic prayer times (Fajr at first light, Maghrib at sunset, Isha at last light) or Sabbath start times from the sunset and twilight fields.
• Real estate listings. Show a property’s day_length and golden_hour window as part of the listing so buyers know exactly how much natural light to expect.

The only requirement when using the free API in production is including a link back to SunriseSunset.io from any page or app that displays the data.

The post Displaying Sunset Times in Javascript using a Free Sunset Times API appeared first on Andy Feliciotti.

It’s incredible to finally see AI reach a usable point to built web products easily. It all started when I found OpenAI’s GPT-3 API which allows you to submit a “prompt” and get a response from their AI engine. Of course since I built this tool originally in 2022 AI has massively accelerated with the launch of models like GPT-5.4 and Gemini 3.1 Pro.

Adding AI to Write at Scale

I even started to play around with OpenAI’s API to auto-write descriptions on my site SunriseSunset.io since I had no way to manually write city descriptions for 100,000+ cities.

One of the key things to know about building AI powered tools is how to write prompts that return meaningful results. That’s where the creativity comes in. The more context and guidance you give GPT-5, the better the output. If you’re new to writing prompts, here is a full list of ChatGPT prompts for writers.

After experimenting on SunriseSunset I wanted to build something more useful and luckily my friend Ryan Robinson had the perfect use case.

Building Free AI Tools for RyRob

Ryan needed a blog title generator for his blog which I figured it would be the perfect use of GPT-5. When I built this tool other blog title generators seemed to just auto-fill your keyword into a preset list of phrases (how boring). It’s funny to think about how people expected free web tools to work before AI.

Using GPT-5 (which stands for Generative Pre-trained Transformer) gives you the ability to dynamically respond to a user’s input as if a person is replying. It handles typos and messy input gracefully, which makes it practical for real users.

While the blog title generator can give you some great ideas for headlines it’s still recommended to modify them or write your own. It’s just kind of a super charged way to get inspiration for your post.

If you are planning on building a web tool with GPT-5 and OpenAI keep in mind it’s usage based pricing. So if you have a large prompt or a lot of users costs can add up quickly. You’ll likely want to add a captcha, accounts, or some kind of rate limiting.

Try out the blog title generator yourself and let me know how it works for you. I’ve also built a number of free AI tools for Ryan’s site that thousands of people use every month. If you want to build your own embeddable AI tools for lead generation, I developed AI Tool Studio on RightBlogger specifically for that.

The post Building a Blog Title Generator with AI appeared first on Andy Feliciotti.

TLDR; Don’t keep any domain of value on GoDaddy, I recommend using Cloudflare as a registrar.

Before I start I just want to preface that Afternic is a company owned by GoDaddy and is a domain name auction platform. I was unfamiliar with this site but it basically functions as GoDaddy auctions but off of GoDaddy. Domain names for sale on Afternic will also show up on GoDaddy auctions and various platforms.

In this post I’ll be going over a couple things:

• How I think the GoDaddy & Afternic domain sale system is broken.
• What to do if you receive a “Action required: Authorize your domain listings.” email.
• General visibility into how your domains can be vulnerable on GoDaddy.

Let’s start from the beginning with the “Action required: Authorize your domain listings.” email from Godaddy and Afternic. To be clear Afternic is owned by GoDaddy so I find this shocking how this system works on their end.

“Authorize your participation in Afternic.” Email

The SmartWP.com domain is in Ryan’s account so all of this happens through his GoDaddy account. We bought the domain in 2019 from GoDaddy auctions for $400.

March 3rd, 2022 Ryan forwards me an email with the subject “Action required: Authorize your domain listings.”. I’m used to getting hundreds of password reset emails or similar emails so nothing was that alarming to me. Typically companies will include a “I didn’t request this” button but this email didn’t have that so I just warned Ryan not to click anything and we’ll just ignore it.

My assumption was that if you don’t click authorize now it won’t authorize.

We were wrong about that assumption.

My second assumption was that if this authorization is approved Ryan would receive a second email.

We were also wrong about this.

We ignored the email (and received ZERO further emails mentioning Afternic).

Fast forward to July 2nd, 2022. I wanted to make a DNS change to SmartWP so I logged in via delegate access. This is where things got funny, I noticed SmartWP wasn’t in his account. Which I figured maybe he moved it or the GoDaddy UI was messed up.

So I sent Ryan a quick text to check if he moved the domain.

So he looked through his account, no indication that the SmartWP domain ever existed in it besides renewal bills he could see.

This is probably the part that made me the most angry, GoDaddy support clearly isn’t trained on this platform or integration. Why wouldn’t their first response be “oh you authorized a sale on X date so the domain sold”.

In the time that GoDaddy response was working to get back to us the person who stole the domain already sold it which is probably the craziest part.

If GoDaddy support had been trained for this we could have cancelled the auction before it ever sold.

This kind of blew our mind at this point, there is no way Ryan authorized this and he checked for any follow up emails.

This eventually lead us to give up and get SmartWP.co as a backup.

Later I’ll go over how we recovered the domain but first I want to go over what to do if you get this email from GoDaddy.

What to do if you get the “Action required: Authorize your domain listings.” email?

If you get an email from GoDaddy Authorize your participation in Afternic I highly recommend calling them right away. Of course don’t click anything in the email but you’ll want to call them and 100% confirm that this “integration” isn’t connecting to your account/domain.

I am convinced after you get this email an attacker is trying to social engineer GoDaddy support to authorize the domain from under you. I have check all of Ryan’s account logs for his email and GoDaddy account and see 0 suspicious logins.

How We Got the Domain Back

I’m not sure if everyone will be as lucky as we were. Ryan spent over 5 hours with support unable to resolve this until someone at GoDaddy saw his tweet and pushed it up to the office of the CEO.

So for most users I sadly don’t think this will be a path forward.

On July 8th Ryan make this tweet below after he realizes the domain is gone from his account. We also see that it’s on sale for $65,000 on Afternic.

Ryan got a bunch of useful leads from this email and eventually the director of education at GoDaddy reached out to him and pushed the issue up the chain.

After a few days we learned that the office of the CEO was dealing with the issue and we waited. They said they’d reach out on July 15th with details.

And just like that Ryan got an email saying the domain is in his account and a call from the CEO office. They weren’t able to give us any more details which I assume is to prevent a lawsuit but we’re happy with the outcome.

We spent 3 years building content and backlinks to the site so it would have been a shame to lose the domain.

Changes I’d Love to see GoDaddy Make

Here’s some feedback for GoDaddy about their Afternic platform. I came to these conclusions after I tried to list a domain using this integration so I could see the inner workings.

Basically ANYONE can signup for Afternic and list YOUR domain for sale. The tricky part come in with their “instant transfer” feature. If the seller (which doesn’t have to be connected to your GoDaddy account) opts into the instant transfer feature GoDaddy will send the authorization email noted above to the corresponding GoDaddy account.

This means you can in theory bulk spam people authorization emails in hopes that someone accidentally approves it. Worse I am assuming a scammer can call GoDaddy and convince them to authorize it.

Ideally they should simple remove Afternic from their products, they have an auction platform currently so I am not sure why it it even exists. Afternic is basically designed in a way to help scammers, the user who uses it to sell your domain can have a separate contact, separate payout, and completely different information from the domain holder’s account.

That being said here’s some small changes I think they can make to the Afternic authorization system that exists after testing how it works currently.

1. Send multiple emails for every step of the process. I tried authorizing this process on my end and it only send ONE email, the initial email listed above. There needs to be a “You Authorized Afternic” email that follows up the connection. This would give someone the change to realize something is happening to their domain.
2. Second the GoDaddy UI doesn’t note ANYTHING about Afternic. If you have a domain authorized for sale in Afternic your domain will still appear “locked” and not listed for sale on GoDaddy auctions. Meaning you won’t even know that your domain is for sale if you check your GoDaddy account frequently.
3. I would love if they had an audit log of approvals like this. After searching the UI there is no indication you approved such a thing, which is insane considering it basically hands your account over to anyone.

Thanks for reading! I really hope this doesn’t happen to others.

From my research, I can tell this happens to others. Since posting this article, I’ve had many reach out and say the same thing has happened to them. As you may know, DNS records can remain the same as domains are for sale, so most users won’t even know this is happening as their domain is sold out from under them.

If you are looking to move your domains I highly recommend using Cloudflare as your registrar.

The post How a Domain Name was Stolen on GoDaddy’s Afternic Platform appeared first on Andy Feliciotti.

Everyone wants their content shared on social media and WordPress offers a massive selection of social sharing plugins.

I stumbled across Social Warfare and Social Warfare pro while trying out social plugins.

Here is my review of Social Warfare.

What is Social Warfare?

Social Warfare offers a simple way to add share buttons to your WordPress site. This review is based off the Pro version but you can find the free version on WordPress.org which offers limited options.

Best of all it offers support for things like ‘click to tweet’ buttons and pulling social share metrics.

https://drawne.com/wp-content/uploads/2019/02/social-warfare-social-networks.mp4

The free version of Social Warfare will feet most people’s needs but if you need support for Reddit, WhatsApp, Pocket, Buffer, Email you’ll want to get Social Warfare Pro.

In addition to more social networks Social Warfare Pro offers pin buttons on images, button designs, and a lot more in depth options.

Social Warfare Features:

• Automatically add social share buttons to your posts
• Support for Facebook, Twitter, Google+, Pinterest, LinkedIn, and Mix
• Display home many times content has been shared on social

Additional Social Warfare Pro Features:

•  Additional social networks
• Button design options including color schemes
• Pin it buttons on images in articles

Reasons I use Social Warfare over other Plugins

I have used plenty of social share plugins for WordPress and I have found that most of them cause formatting issues or just add a lot of bloat to pages. One of my favorite things about Social Warfare is how little it affect page load speed and the simple yet effective button design.

The pro version of the plugin offers plenty of button design options. I have found the default square colored buttons to be the most familiar and pleasing but if you want to heavily customize you can. This includes modifying button shape, size, and color schemes.

Need Color Inspiration?
View: Best Color Palettes

One feature I have never seen in any other social sharing plugins is the ability to set a custom Pinterest image. This is huge if you plan on getting traffic from Pinterest. While editing a post you can set a custom image and text to go along with it for when the user hits the pin button. If you want a high traffic blog I recommend adding a tall Pinterest image to all of your longer posts.

In addition to share buttons you can also embed ‘click to tweet’ widgets that give a user a call to action to tweet something from an article. It’s also super simple to add them to your article since it adds an embed button to the WordPress editor (and a block for Gutenberg users).

Social Warfare also adds social share counts to your articles in the WordPress dashboard. I have found this feature to be extremely useful since you may have articles being shared you were unaware of. Best of all if you are an advanced WordPress developer you can use this metric in custom search algorithms for sorting.

The plugin lets you select display options based on post types. So if you only want share buttons on your single blog posts it’s simple to do. If you’re a developer you can manually add the Social Warfare buttons anywhere in your theme. Additionally if you want to place the share buttons in the middle of an article like this:

[social_warfare]

you can simply use the Social Warfare shortcode.

Social Warfare Frustrations

With all of the benefits of Social Warfare there is one main downside for my site I have found using the plugin.

First of all you can’t use the share buttons for archive pages. So for example if your blog revolves heavily around category and taxonomy pages you can’t add share buttons to those even programmatically. You can have share buttons show up for each post on those pages but not the archive page specifically. Much of my site AwesomeStuffToBuy revolves around archive pages so I wish it offered a way to include those buttons for the actual archive page. It is quite frustrating since the share buttons work so well!

Additionally Social Warfare lets you set Twitter/FB share images for posts. This is a great feature but I wish it would detect if you are using Yoast SEO since the UI for selecting a social image in the plugin is quite large in the editing screen (since I would rather use Yoast to set these).

Another feature of Social Warfare Pro is pulling twitter share counts using third party services. This is out of the control of Social Warfare since Twitter removed share counts but I have found the third party services they integrate with to be hit or miss in grabbing numbers.

Is Social Warfare Pro Worth It?

If you need social share buttons on your blog I highly recommend Social Warfare pro. The additional options offered by the Pro option is well worth it. I still don’t think this is the perfect option but it’s the best social share plugin I have found for WordPress.

4/5 The Best Social Share Plugin for WordPress
 4/5

Get Social Warfare Pro

The post Social Warfare Review: Social Sharing WordPress Plugin appeared first on Andy Feliciotti.

Page builders have taken WordPress by storm. There are tons of choices for page builders, Beaver Builder, Divi, Themify, Cornerstone, and loads more.

After testing out a lot of the WordPress page builders I have found Elementor to be the best page builder for WordPress.

Here is my Elementor Review.
(based on Elementor Version 3.0.6)

What is Elementor?

Elementor is a WordPress page builder that lets you build pages and posts using a simple drag and drop editor and best of all it’s compatible with all WordPress themes.

Elementor also offers the ability to build headers, footers, and even popups using its drag and drop editor. This is an incredible addition to any WordPress site since you can build complex pages easily.

https://drawne.com/wp-content/uploads/2019/01/using-elementor.mp4

Loaded with plenty of useful widgets and widely supported by developers Elementor has quickly become the most popular page builder for WordPress.

Main Elementor Features:

• Lets users build pages using an easy to use drag and drop editor.
• 30 widgets to include in your pages.
• Compatible with all WordPress themes.

Elementor Pro Features:

• Fully customize your theme using the Elementor editor for your header and footer.
• Form builder with popular marketing integrations including Mailchimp.
• Design popups for email capture forms (or any other use cases).
• 50+ additional widgets to use in your Elementor pages.
• Add Custom CSS to Elementor pages.
• Advanced Custom Fields integration which lets you display ACF fields in Elementor pages (love this feature).
• Additional WooCommerce support

Elementor Features & What I love About It All

If you’ve ever built a WordPress site from scratch either using a custom theme or a premium theme you know how it can be frustrating at times.

Many themes become unsupported overtime, are hard to learn when first installing, or worse don’t end up meeting your needs.

Since Elementor is separated from your theme you don’t have to worry about being locked into one theme which is simply incredible to me. I have found myself using Elementor with WordPress theme WP Astra for all new sites that I create.

This makes Elementor a great addition to any site looking to developer stylish pages. Best of all if you’re a developer there are plenty of hooks and actions that will make customizing WordPress with Elementor nearly limitless.

I have also been massively impressed with Elementors updates and the amount of new features they have added just from the few months I have been using the plugin.

Elementor Pro includes a header and footer theme builder so you basically can overwrite all of the default elements of a theme. Things like colors and fonts are primarily controlled by the theme while Elementor can modify the design of everything else. Plus if you know CSS you can manually overwrite any element as you see fit.

The basic set of elements in the Elementor page builder include useful ones like a text editor (similar to the classic WP editor), headings, buttons, social icons, shortcode embed, and more. 

This makes the free version of Elementor very useful out of the box, especially since you have access to all of the Elementor layout options for columns, rows, etc.

Oddly enough one of my favorite features of Elementor is the ability to right click elements. This is one tweak I have never seen in another page builder including Gutenberg and it makes building pages quickly a breeze. No longer am I constantly clicking elements to figure out what to select, the right click gives me the most important options I need at a glance. Especially if you are building multiple pages, you can simple click copy and paste whole sections of pages into another Elementor page.

Elementor includes most of the options you need to build awesome pages. But sometimes you want to get under the hood and modify a page’s CSS. Elementor Pro includes a simple to use CSS editor to perfectly modify pages as you’d like. You can add global CSS for all pages or specific CSS to elements on the site. Plus you can add classes to any element making this bridging most gaps you’d want to manually control.

Out of all of the page builder I have used the responsive options in Elementor just seem more thought out. Elements involving margin, padding, font-size, etc all have options to set them manually for device size. This has become extremely useful when building a responsive web pages.

Additionally like many page builders you can view the entire page in a responsive editor. This make it great for quickly fixing mobile or tablet issues on your site. A lot of designers miss out on viewing the mobile experience which is the primary way people visit sites now.

Some of the responsive options are extremely helpful like reversing the order of a column when viewed on mobile. So if you have a photo on the right hand side of a row you can have it appear on top on mobile.

Elementor Pro also offers the ability to create headers and footers using its editor. This means you can create complex headers and footer easily using the Elementor editor. You can also select what pages the header/footer shows up on so if you have one part of your site that you’d like to use it on it’s easy to do that.

I can’t stress how much I love this feature.

Being able to overwrite everything in your theme and use Elementor’s editor is incredible.

In addition to creating headers and footers you can also create pages for custom post types.

I found this extremely useful if you need to setup a custom post type page to display custom fields for example.

Additionally the ‘text’ widget lets you pull any custom field (ACF supported) from the post so you can easily make pages for portfolios, video viewers, store location pages, etc. Anything where you have data in custom fields and want to display is easily. Best of all it’s beginner friendly when previously you needed a developer to modify a page like this.

When you create a theme page for a post type you have the ability to set when it’s displayed as well.

You can also overwrite archive pages using the Elementor editor which you can see an example of a page I’ve done on the IGDC Podcast page. I didn’t just want to list posts like a standard archive page so I used the feature to include details to the podcast, links to download, and a list of the podcasts dynamically pulled from the post type.

One of the newest features to Elementor is Popups.

Now that you have a grasp of all of the widgets in Elementor they all can be used to create popups. Email capture, promos, cookie noticies, just about anything can be made.

After designing a popup or using one of their templates you can pick when the popup is displayed. Either using a button, or on page load, or loads of other options.

Now that you have see the majority of features in Elementor the good news about all of it is that they have hundreds of templates for everything. Headers, pages, footers, pop ups, all have pre built templates.

So if you’re not too keen on what an about page should look like you can start with one of their templates and tailor it to your liking.

One thing I appreciated is the fast performance of the Elementor plugin as well. Many page builders I have used in the past felt sluggish. I typically use WP Rocket on my sites and achieve an under 1 second load time on Elementor pages using Pingdom.

I hate to sound overly positive but I really haven’t found anything that hangs me up about loving Elementor.

[social_warfare]

How Much Does Elementor Cost?

Elementor is free on WordPress.org but if you want to get the most out of this page builder I highly recommend upgrading to Elementor Pro.

The free version of Elementor is great since it lets you get a feel for the Element editor and it includes most of the useful widgets.

Elementor Pro costs $49 a year but if you build a lot of websites like I do you can get an unlimited licence for $199 a year. Which for me is a steal since I can use it on all of my sites while at the same time learning more about Elementor.

If you’re managing many client sites using the Elementor unlimited license can quickly speed up your workflow while making your yearly costs predictable.

Get Elementor Pro

Is Elementor Pro Worth It?

As I said at the start of my review I HIGHLY recommend Elementor and Elementor Pro.

The additions that Elementor Pro brings to the Elementor builder is well worth the cost in my book. Whether you have a simple blog and want to create a stunning homepage or have a business site Elementor will meet all of your needs.

The fact that Elementor Pro also offers an unlimited use license also makes it fantastic if you build a lot of sites for clients. This way you are mastering one tool and can quickly work when building new sites.

5/5 the Best WordPress Page Builder
 5/5

Get Elementor Pro

The post Elementor Review: The Best WordPress Page Builder in 2020? appeared first on Andy Feliciotti.