Development of a WooCommerce Plugin: Responsive iFrame Image Display and iFramely Integration -- 2

Job ID: 37216225

Budget: €30 – €250 EUR

Project Overview:

We are seeking an experienced freelancer to develop a custom WooCommerce plugin.

The plugin's purpose is to enable the display of images, which are accessed via iFramely links and intended to be shown within an iFrame, in our WordPress/WooCommerce Content Management System. The goal is to display these images *responsively* throughout the system, particularly on product pages such as the product list, product detail page, thumbnails, etc.

The display of the iFramely (embedded in an iFrame) product images in the frontend on the product detail page should also be displayed in the gallery. The gallery pictures should all have the same format and size.

Images already uploaded to a product in the media library must still be displayed in addition to the iFramely images.

Additionally, iFramely links inserted into product descriptions should be automatically detected and displayed within an iFrame as well.

It is crucial to note that the images must be displayed exclusively within iFrames to avoid copyright infringements and ensure optimal responsive display.

Upon installation, the plugin should integrate all necessary scripts and elements system-wide to execute the described functions properly.

Additional Requirements:

Security and Copyright Compliance:
It is of utmost importance to ensure that images in the frontend of the shop are neither clickable nor downloadable. Any form of tracking, cookies, or external resources should be excluded from the iFrames to maintain data privacy regulations.

Plugin Compatibility and Optimization:
The plugin should be compatible with various themes and versions of WooCommerce. Efficient coding and optimization are required to avoid impacting website loading times.

User-Friendly Configuration:
The setup and configuration of the plugin should be simple and user-friendly, preferably through the WooCommerce admin dashboard.

Documentation:
A comprehensive documentation should be created, explaining the installation, configuration, and usage of the plugin step by step.

Examples and Resources:
The example data we received from iFramely provides you with a clear understanding of how the iFrame links look and what information they contain. Here are some examples of iFramely links and data:

id: "6f7f7f42-67b5-4b69-9d20-60a9f5bc8b3c"
width: 419
height: 1500

url:
"https://m.media-amazon.com/images/I/710+Z9uXPSL._AC_UL1500_.jpg"
embed: <div style="max-width: 419px;"><div style="left: 0; width: 100%; height: 0; position: relative; padding-bottom: 357.9957%;"><iframe src="//cdn.iframe.ly/api/iframe?url=https%3A%2F%2Fm.media-amazon.com%2Fimages%2FI%2F710%20Z9uXPSL._AC_UL1500_.jpg&key=6b514aefe0a76421835e3f41a61df0d3" style="top: 0; left: 0; width: 100%; height: 100%; position: absolute; border: 0;" allowfullscreen></iframe></div></div>

iframelyUrl1:
"//cdn.iframe.ly/api/iframe?url=https%3A%2F%2Fm.media-amazon.com%2Fimages%2FI%2F710%2BZ9uXPSL.AC_UL1500.jpg&key=6b514aefe0a76421835e3f41a61df0d3&iframe=1"

iframelyUrl2:
"//cdn.iframe.ly/api/iframe?url=https%3A%2F%2Fm.media-amazon.com%2Fimages%2FI%2F710%2BZ9uXPSL.AC_UL1500.jpg&key=6b514aefe0a76421835e3f41a61df0d3"

iframelyUrl3:
"https://cdn.iframe.ly/api/iframe?url=https%3A%2F%2Fm.media-amazon.com%2Fimages%2FI%2F710%2BZ9uXPSL._AC_UL1500_.jpg&key=6b514aefe0a76421835e3f41a61df0d3"
Project Completion:

The successful completion of this project will be a fully functional and optimized WooCommerce plugin that seamlessly integrates iFramely links and responsive iFrame images into our CMS. The plugin should be easy to configure and user-friendly, while adhering to the highest standards of security and data privacy. We look forward to your expertise and creativity in executing this plugin.
Related categories: PHP JavaScript CSS WooCommerce WordPress Plugin