Embedding HTML code and Content into Custom Pages

With your Zenfolio account, we offer Custom Pages that can be used to fulfill the general needs of a photographer website. Custom Pages are highly customizable, even down to the HTML level, and it is possible to embed HTML code into the content area of the Custom Page.

Example services that provide embeddable content include: Click here for an example of a custom page that contains an embeddable form that site visitors can fill out.


Some photography associations/clubs also offer embeddable badges that photographers can add to their sites to display their memberships or awards on their site.

Example of associations/clubs that offer embeddable codes include:
  • PPA
  • The Knot
  • WeddingWire
Click here for an example of a Zenfolio website that contains embeddable badges from photography associations and clubs. Scroll to the bottom of the page to see the badges.
 

Limitations

In addition to the services listed above, almost any service that provides embeddable HTML code that can be embedded into a webpage can be used by embedding their code into a custom page. The important part to keep in mind is that the code cannot be embedded into the <head> of the page-it can only be embedded into the <body> of the page.

That means that there are some services that provides embeddable HTML that cannot be used with Zenfolio. Please click here for a list of some of those services.

Lastly, custom pages can only contain a maximum of 100,000 characters of HTML markup on each page. If you would like to display more content, we recommend splitting it up into multiple pages.

 

Get the Code

To use a service that provides embeddable code, you'll need to first use that service to generate the code. After generating the code, you can create the custom page and then embed it into the custom page.
 
  • For general information on how to create a Custom Page please see this link.
  • Also, the same embed feature and tools are available for adding content to a blog.
  • Embeddable content can also be embedded into the site's Header or Footer.



Here are the steps for embedding code into a Custom Page:
  1. Open the Custom Page for editing then click on Embed in the Formatting Toolbar.
  2. Paste in the embeddable code into the Content Field.
  3. Preview the content.
  4. Go to the Set Layout tab to make any necessary adjustments to the content's presentation.
  5. Insert the content.
Custom Page Embed Tool


 

Embedded Content Not Lining Up?

In some cases, the embedded content may not display correctly in the embeddable content window. In these case, it can sometimes help to insert the code directly into the page's HTML Source code rather than using the embed tool.

This is done by clicking on Source in the formatting toolbar to switch to the HTML Source view in the content editing window.
Source

Then in the content window, paste in the embeddable code.


Please note that while the option to manually edit the HTML code your custom pages is provided, editing source code requires knowledge of Web programming and is not covered by Zenfolio support.