How to embed into Joomla?

Embedding a flipping book on Joomla can require more steps than the standard embedding on other website platforms like WordPress or Wix.

Note! If you’re using a non-standard Joomla editor, just try to follow our general embedding guide. It will work fine for FlippingBook Online Starter and higher plans. However, if it’s not working and your plan is Starter and higher, please proceed with the following instructions.

Not all standard Joomla editors process FlippingBook embed code correctly – for instance, our code works perfectly in CodeMirror but is not supported by TinyMCE. Of course, if your article or post made on Joomla only consists of a flipbook alone, you can just turn off the editor completely, but usually, a book needs to be complemented with a bit of nicely formatted text, and that’s easier to do so in a WYSIWYG editor.

Note! If you are not an administrator user, the installation and customization options mentioned in this article might be unavailable to you. In that case, please consult with your Joomla administrator.

In this article, we show how to embed an example publication using two custom editors - ARKEditor and DropEditor.

• Installing and enabling custom editors (ARKEditor or DropEditor) in your Joomla space
• Embedding using ARKEditor
• Embedding using DropEditor

Installing and enabling custom editors (ARKEditor or DropEditor) in your Joomla space

Generally, Joomla editors can be found and downloaded from the Joomla Extensions Directory, but here are the direct links to ARKEditor and DropEditor for your convenience:

ARKEditor: https://webxdesign.co/?Itemid=309 (the Personal Usage version is more than enough for embedding needs)

DropEditor: https://www.joomunited.com/dropeditor-download

Here’s how you proceed after finding the page of the extension you need to install: 

• Click the download button on the extension’s page to get its installation .zip file.
  
• Then open the System page from Joomla menu panel on the left. 
• Within the System Dashboard dialogue that would open, click the Extensions link in the Install block:
  
  
• Drag and drop the .zip file with the extension you’ve downloaded and wait until the installation is complete:
  
• Go back to the System Dashboard page, but now click the Global Configuration link in the Setup block:

• Change your Default Editor in Site Settings - it will now be used for creating new articles:
  
• Click on Save button in the upper left corner to apply the changes:

Embedding using ARKEditor

If you want to use ARKEditor as your editor of choice and have already selected it as your default editor, then follow these steps to embed your publication:

1. Expand the Content group in the menu panel on the left and click the plus button to open the editor:

2. Open the Flipbooks page in your FlippingBook account, hover over the flipbook you need to embed, and select More > Embed.
   
3. Make sure that the Embed to Website option is selected and copy the embed code using the Copy code button. 

4. Paste the embed code in the article body in the Source tab (if you paste it in the Design tab, the embed code will appear as plain text instead of showing the embedded flipbook) and click Save once you’re ready to publish the article:
   

Embedding using DropEditor

If you’ve installed DropEditor and selected it as a default editor, here’s how you can embed a flipbook into your page

1. Expand the Content group in the menu panel on the left and click the plus button to open the editor:

2. Open the Flipbooks page in your FlippingBook account, hover over the flipbook you need to embed, and select More > Embed.

3. Make sure that the Embed to Website option is selected and copy the embed code using the Copy code button.

4. Press the Source button and paste the code in the body of the article. Press Save button to publish the article:
   
   

If you want to check the final result, you can proceed to your Joomla website by clicking the Your Joomla website link in the upper right corner and proceeding to the article: