How To Add Three Shapes Designs
Where To Set Title And Description
Where and How to Set Shape Type
Where and How to Add Your Images in Three Shape Designs
How to Uploading & Retrieve Image URLs?
Live Demo

To integrate this Three Shapes Designs into your biography page, please follow these installation instructions.

Step One: Insert a Custom HTML Block.

Step two: Just Paste below JS code into your Custom HTML block

    <!-- Include external JavaScript file -->
    <script src="https://biz15.com/trialone/custom/js/threeshapedesigns.js"></script>
    
    <!-- Initialize the ThreeShapeDesigns object with an array of designs -->
    <script id="threeShapeDesigns">
    
        // Create an instance of ThreeShapeDesigns
        new ThreeShapeDesigns([
            // Design details for the first item in the array
            {
                // Design style (e.g., "triangle" , "circle" , "square")
                style: "triangle", 
    
                // URLs for three images associated with the design
                image1: "image-1.jpg",
                image2: "image-2.jpg",
                image3: "image-3.jpg",
    
                // Title of the design
                title: "Your Title Goes Here",
    
                // Title color
                titleColor: "blue",
    
                // Paragraph describing the design
                paragraph: "Your Paragraph Goes Here"
            }
        ]);
    </script>

The result following the completion of the steps.

Live Demo

Where to Set Title And Description

Here’s an example of Where to Set Title And Description

    // Title of the design
    title: "Your Title Goes Here",

    // Title color
    titleColor: "blue",

    // Paragraph describing the design
    paragraph: "Your Paragraph Goes Here"

Where and How to Set Shape Type

Here’s an example of Where and How to Set Shape Type ,

options : “triangle” , “circle” and “square”

    // Design style (e.g., "triangle" , "circle" , "square")
    style: "triangle", 

    // Design style (e.g., "triangle" , "circle" , "square")
    style: "circle", 

    // Design style (e.g., "triangle" , "circle" , "square")
    style: "square",

Where and How to Add Your Images in Three Shape Designs

This design only and must need three images

below code for Where and How to Add Your Images in Three Shape Designs :

    // URLs for three images associated with the design
    image1: "image-1.jpg",
    image2: "image-2.jpg",
    image3: "image-3.jpg",

To upload an image and retrieve its source (URL), please follow these steps :

Select or Prepare Your Image: Begin by choosing the image you wish to upload, ensuring it’s in an appropriate format (e.g., JPG, PNG).

Step One : on Your Dashboard Select “File Link” panel and click “File link” button on your Top Right corner

Step Two: Select your desired image and and its name then proceed by clicking the “Create File Url” button.

Step Three: Now, you can see bellow figure that highlighted the image url and just “Copy Your Image Address.”

“Follow the previously mentioned steps to upload and obtain the image URL for all of your images.”

Try Your Self

Other Style Sections :