I am wondering what’s the best way to go, I don’t love my statagpt.com landing page and I want to redesign it. I fear that the Pickaxe UX is a bit rigid, since I would like to play more with the HTML. How would you handle that? What are good examples?
A quick solution is to keep it simple, just use 2 sections (Header and List of Tools). Make sure the header banner design will stand out. The challenge though is to keep it consistent in mobile view. Here’s an example: https://app.plateperfectai.com/
Another solution is to use a custom landing page outside of Pickaxe. But I would not suggest his approach if you’re just starting out as it will add cost to your operation. But if you’re starting to get traction, here’s 6 landing page templates that you can test out: Premade Landing Page Templates for for Ai Apps & Ai Agency
By the way, to get rid of the white overlay in your header section, try this css script:
<style>
/* CSS Script to Remove White Overlay */
section#hero {
background-blend-mode: normal !important;
}
</style>
Not suggesting mine is a good example in the context of what you are looking for but it hopefully serves as a good example of how much styling can be done to improve the ‘uniqueness’ of a studio.
I use some scripting in the header and footer to do most of the heavy lifting and then I pull through external css style sheets that I store (at the moment, on my own storage but soon to be located on AWS).
The code example above from @vener can be added in the same way (as described in his post) in the header section which is accessed via the Settings tab on your Studio.
I add a series of buttons on different pages, restyled input fields, additional images and I style text with new (google) fonts and popups including an on page FAQ popup. Attached are some screen shots - the final one shows how I have modified my prompts to have the Ai style my output with arrows/bullets and indents. I also add code to deal with basic SEO so when my site is shared via social media, it pulls through a styled description and image.