Wattpad Widget in WordPress

How to Embed Your Wattpad Story Widget Into WordPress

Last Updated on by Michael Brockbank

If you have a WordPress blog, you can use the embed code from Wattpad to promote your book. All it takes is a quick, copy-and-paste of the code and you’re good to go. Today, let’s dive into embedding a story.

Because Wattpad has had some major changes over the years, their instructions from 2013 are quite a bit outdated. In fact, the article still states that WordPress can’t handle iFrames, which is absolutely false.

In reality, I use iFrames all the time to embed YouTube videos into WordPress.

Embedding a Wattpad Book Into WordPress

For those who have a WordPress blog, using the Wattpad Story Widget is actually quite easy. You can add it to any post, page, or even the sidebar of your website.

Essentially, anywhere you can add custom HTML, you can place the Wattpad widget.

The TLDR of embedding Wattpad stories into WordPress consists of:

  1. Log into your Wattpad account
  2. Click the “Write” option at the top
  3. Click the My Stories option
  4. Find the story you want to embed and click the title
  5. Click the “View as reader” button
  6. Click the “Start reading” button
  7. Scroll down and click the “</>” icon on the left
  8. Copy the embed code from Wattpad
  9. Paste the embed code into a Custom HTML block in WordPress

Once the code is pasted, you can do with your page or post as you wish.

Step 1: Open Your Story

The first thing you need to do is copy the embed code of the story you want to share. For this example, I’m going to embed my story, Despair.

From your Wattpad profile page, go to “Write” and click “My Stories.”

My Stories in Wattpad

Click on the story you want to embed into WordPress. This can be any story you have saved regardless if it’s complete or not.

Open Story in Wattpad

Click the button to “View as reader.”

View as Reader

Click the button to “Start reading.”

Start Reading

Step 2: Copy the Embed Code from Wattpad

On the left side of your screen, scroll down to the icons for sharing.

Click the icon for “</>”. This is the HTML code you’ll need.

Note: The code you copy will show the current chapter of the book you’re “reading” on your website. So, if you copy the code from chapter five, chapter five will show in the embed under the book’s description.

HTML Icon in Wattpad

Copy the iframe code below the preview screen.

Copy Wattpad iFrame Code

Step 3: Paste the Wattpad Embed Code into WordPress

Go to any post or page in WordPress.

Add a Custom HTML block to your site’s content. You can find it easily by simply searching for “html.”

Custom HTML Block in WordPress

Paste the iFrame code you copied from Wattpad into WordPress.

Paste iFrame Code

Once the code is pasted, you can save the post or page and your Wattpad widget is ready for visitors.

You can also preview the code from the WordPress post or page so you can see how it appears.

NOTE: The size of the Wattpad widget cannot be adjusted in the code as the iFrame is not responsive. It won’t show all of the elements if you adjust the height and width smaller.

What About Using the Sidebar in WordPress?

To add the Wattpad widget to your WordPress sidebar, it works similarly to the above. All you need is a Custom HTML block and paste the embed code.

However, the iFrame code from Wattpad is not responsive. This means the data stays the same size regardless of the dimensions of the sidebar.

In other words, placing the widget in an area that is smaller than the dimensions in the code will result in the widget being cut or only becoming partially visible.

Wattpad Sidebar Widget

So, while it is possible to show the widget in the sidebar, it may not fit most themes in WordPress. It’s better to use the widget in a post or page.

Why Add a Wattpad Story to WordPress?

You shouldn’t rely purely on the search function for readers to find your Wattpad story. Although there are a lot of things you can add to make your story stand out, you want to get as many eyes as possible to read your manuscript.

In this instance, embedding Wattpad into your WordPress blog just gives you more potential to engage a larger audience.

Sure, you can simply link to the story as you would anything else. But the widget delivers the cover, tags, and description of your book.

Not to mention being accompanied by other sharing tools in case your visitor wants to further broadcast your story.

As with the success of any book, it all really comes down to marketing. People won’t read it if they don’t know it exists. Embedding it into a blog post or page highlights your creation for your audience.

Adding your writing to your blog is only the first step, though. It’s also a good idea to share it on any social media site you use.

For example, I always share each episode of Despair the moment it goes live on YouTube and is updated on Wattpad.

The point is that marketing matters when it comes to promoting yourself as a creator. Using the Wattpad widget in WordPress simply makes the book stand out among the other content.

6 Ideas for Showing Your Wattpad Books in WordPress

The idea of embedding your Wattpad book into WordPress is a form of marketing. You can gain somewhat of an audience without spending money on ads and such.

It’s a free method that you can use in a variety of ways.

  • Writing a Post to Share Your Story – Create a post to share your works with those who follow your blog. It’s an easy way to get a few more readers who might be interested in your creativity.
  • Create a Page to Share Stories – There’s nothing wrong with creating a gallery page for your stories, especially if you use it as a landing page for links from other content.
  • Embed it on the Home Page – Prominently featuring your Wattpad story on the front page could engage additional readers who stumbled across your blog.
  • Using as a Sidebar Widget – A sidebar widget is nice because it’s seen on nearly every page of your website. However, the iFrame from Wattpad doesn’t work the best in a smaller space.
  • Don’t Forget External Links – Although the embed is fun and attractive, don’t forget to link back to your Wattpad story through traditional links. There’s nothing wrong with a text link.
  • Create Popup Ads in WordPress – Some popup plugins allow iFrame coding from Wattpad. This means you can create popups displaying your latest book to visitors on the blog.

The idea is to share your story as much as possible, but not to the point of seeming annoying. You want to market the book but you also want to make sure the content is relevant to the link.

Grammarly Grammar Checker

What’s Your Favorite Writing Platform?

The Internet is full of writing platforms of all kinds. So far, Wattpad and Inkitt are two of my favorite free platforms for sharing stories. I have also had far more interaction on Wattpad from readers than on Vocal.

It all comes down to what works best for you and what you’re trying to build.

What writing platforms do you use the most?

Michael Brockbank
Follow Me...

Notify of

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Inline Feedbacks
View all comments