The Ultimate Toolbox for creating
amazing web sites!
Getting started with AI
Improve your online presence easily with the help of WYSIWYG Web Builder's AI-powered tools. Make your website content better, reach a global audience by translating it, create eye-catching images to impress your visitors, and generate custom code for your web projects with ease. WYSIWYG Web Builder AI combines all these important features in one place, giving you a complete platform to take your web design projects to new levels.
Text Generation and Enhancement: Create text, headings, articles, and more by entering custom prompts or choosing predefined ones. You have the flexibility to modify text length, tone, grammar, and overall style to suit your needs.
Multilingual Translation: Translate text into over 25 languages, such as English, Spanish, French, German, and Italian, making it a valuable resource for communication across language barriers.
Image Generation and Manipulation: Generate new images based on text input, create variations of existing images, and enhance images using in-painting techniques. You can specify desired changes, such as adding objects, replacing screen content, or altering hairstyles.
Image Expansion: Expand images beyond their original borders by providing descriptions of the desired changes. The zoom slider allows you to adjust the frame size according to your preferences.
Background Removal with AI
Use the Remove Background tool to effortlessly create images with a transparent backdrop, allowing your visuals to seamlessly blend into various backgrounds and layouts.
Custom Code Writing: For web development and coding tasks, you can utilize AI functionality within HTML objects, Object HTML, and Page HTML. This includes adding scripts, HTML, CSS, PHP, and more, making it a useful tool for developers.
AI Vision (experimental): This can recognize what's in an image and lets you ask questions like, "What's in this image?", "Identify all the food items in the image." or "Write a caption for this image for use on a website". Basically, this is the reverse of 'text-to-image'.
IMPORTANT NOTE:
The AI tools in WYSIWYG Web Builder are implemented using the third-party OpenAI API (ChatGPT, DALL-E).
You will need an OpenAI API key in order to use this functionality. If you do not already have an OpenAI account then you can create it here: https://platform.openai.com/signup
You can create an OpenAI API key for free. New users get free $5 worth of free tokens. These tokens expire after 3 months.
After the quota has passed you can choose to enter billing information to upgrade to a paid plan and continue your use of the API on pay-as-you-go basis.
The API key can be entered in Tools -> Options -> Artificial Intelligence
See also the Artificial Intelligence FAQ for limitations of a free account:
https://www.wysiwygwebbuilder.com/forum/viewtopic.php?p=490391
Generating Text with AI
For standard text, you can use the Artificial Intelligence button on the Ribbon to open the "Generate Text with AI" dialog. However, this functionality is available for almost all text input fields within WYSIWYG Web Builder via the context menu!
In the dialog, you can enter a custom prompt or choose one of the pre-defined prompts from the Suggestions drop down list.
Note:
The [text] portion of the prompt serves as a placeholder and should be substituted with your subject.
If you open the dialog while text is selected then this text will automatically replace the [text] place holder.
After inputting your prompt, simply click the 'Generate'. Please be patient, as the speed of displaying results in the Output field may vary depending on the current server load.
Once you're satisfied with the generated text, you can click the 'Use Text' button to save it. However, you also have the flexibility to enhance or refine the text further. This includes the ability to adjust its length, modify the tone (casual, professional, confident, friendly), streamline it for clarity, improve grammar, or even translate it into a different language!
Tone
Change the tone of the text (casual, professional, confident, friendly)
Translate
Translate text to more then 25 languages: English, Spanish, French, German, Italian etc
Simplify
Simplify the language of the text
Make Longer
Add more details to increase content length to the text
Make Shorter
Shorten the text
Fix spelling
Fix spelling and grammar of the text. This may be useful for text you have inserted yourself.
Generating Images with AI
For the image object, you can use the Artificial Intelligence button on the Ribbon to open the "Generate Image with AI" dialog. However, this functionality is available for almost all other image input fields within WYSIWYG Web Builder via the context menu!
In the dialog, you can enter a custom prompt or choose one of the pre-defined prompts from the Suggestions drop down list.
Optionally, you can select one of the 25 styles. For example: Abstract Curves, Anime, Artistic Portrait, CGI Character, Fantasy,
Oil Painting, Photo, Pop Art, Steampunk etc
Use the size property, to specify the size of the output image.
Larger images will have more details, but will also use more OpenAI credits!
Currently, images generated by OpenAI are always square (1:1), but WWB has the ability to crop the generate images to different landscape or portrait aspect ratios.
After inputting your prompt, simply click the 'Generate Images' button. Please be patient, as the speed of generating the image may vary depending on the current server load.
If you're satisfied with the one of the four generated images, you can select that image and the click 'Use Image' button to save it. However, you also create 3 other variants of the selected image by clicking the 'Generate variant of the selected image' button.
Note:
By default, the software uses the DALL-E 2 model to generate images, but DALL-E 3 is also supported which generally gives much better results. This can be configured in Tools -> Options -> Artificial Intelligence
DALLE·E 3 is the highest quality model and DALL·E 2 is optimized for lower cost. See also: https://openai.com/pricing
It is also possible to create amazing logos! Also check out the AI generated images in the templates for many other examples!
Note: When these image were created (2023), AI had not yet reached the point of perfection in generating text logos.
In some instances, it struggled to accurately capture the desired text. Nonetheless, the outcomes were consistently remarkable. It's highly promising, and it's probable that it won't be long before AI can seamlessly craft flawless logos.
Create a variation of an existing image
Create an alternative rendition of the provided image. Simply choose the desired size and aspect ratio, and then click 'Generate Images'.
This will generate 4 variations of the input image. Select the one you like and click the 'Use Image' button to save it.
Image Enhancement
Image Enhancement is also known as 'in-painting'. Use the brush to mark the area that you want to add an element to, and describe what you want to add in the prompt field. For example, place an object in the background, replace the content of a computer or mobile screen, billboard, t-shirt, apply a different hairstyle to a person ect. Anything you can think of!
The brush can be set to 10, 20, 30, 40 or 50 pixels. The Reset button makes it possible to clear the brush strokes and start over.
Example 1
Example 2
Image Expand
Image Expand is also known as 'out-painting'. This tool expands an image beyond its original borders by providing a description of the changes you want to make. Use the zoom slider to change the frame size.
In this example, we have used one of the previously generated images and wrote a simple prompt to add tree and flowers.
Remove Background with AI
This feature automatically detects a person or object in an image and replaces the background with a transparent one.
Unlike traditional background removal methods, this tool is works 100% automatically. You don't have to manually select the background/foreground layers to separate them - just click 'Remove Background' and it instantly generate a new image with the background removed!
AI background removal is a complex process that involves a myriad of techniques and algorithms. To implement this powerful functionality seamlessly, we have integrated the third-party web service, Remove.bg. This ensures you get top-notch results while keeping the process user-friendly and accessible.
You will need to request an API key, to us this service.
https://www.remove.bg/dashboard#api-key
The first 50 images are free, after the quota has passed you can choose to upgrade to a paid plan and continue your use of the API on pay-as-you-go basis. The API key can be entered in Tools -> Options -> Artificial Intelligence
Generate custom code with AI
Write custom code with help to AI! AI functionality is available in the HTML object, Object HTML and Page HTML.
Add scripts, HTML, CSS, PHP etc.
Give a description of the code you want to generate or choose one of the prompt suggestions from the drop down list.
Note:
In some cases, the generated code may not be directly usable because AI does not know the structure of the rest of the page.
So, unless you exactly specify where the code will be added, you may need to make some modifications. However, in most cases AI will add comments to the code, to make it easier to understand how it works.
AI Vision
This is an experimental feature and currently only available for users who have an OpenAI account with access gtp4.
AI Vision can recognize what's in an image and lets you ask questions like, "What's in this image?", "Identify all the food items in the image." or "Write a caption for this image for use on a website". But you can also use it to extract text or translate the text from the image to a different language.
This feature can be useful for web design to create titles or detailed descriptions for SEO purposes. But you can also use it to create a text prompt from an image and use that to create a new image. The results of this tool are already very impressive, and we can’t wait to come up with more features that use this functionality...
Example prompts
• "What's in this image?"
• "Identify all the food items in the image."
• "Write a caption for this image for use on a website"
• "Translate the text from the image to English"
• "What is funny about this image"
• "Explain the data from the chart"
Prompt Manager
The Prompt Manager can be used to add, edit or remove prompts from the 'suggestions' lists. You can access the Prompt Manager via the link at the bottom of the suggestions list. Each category (text, images, code) has its own prompt list.
Numerous websites offer tutorials on writing effective AI prompts. So, if you're seeking inspiration, you'll find a wealth of information at your fingertips. AI prompts are not specific to WYSIWYG Web Builder.
Related Tutorials: