Sample designs · replace the fictional content with your own.
AI ChatWorkflow example
Combine sections in one page
You
Combine these sections in my existing project. Check conflicting CSS classes, duplicate IDs, image paths and JavaScript before editing.
AI · example response
I will inspect their formats and dependencies, then propose shared styles and unique identifiers. Similar-looking sections may still need code changes to work together.
You
Use this section order and keep the navigation working. Show the merged page at phone and desktop widths.
Steps to take
Inspect compatibility
Compare formats, CSS, scripts and file references.
Integrate the sections
Unify styles and identifiers within the chosen page.
Test the full page
Check navigation, buttons, images and mobile behaviour together.
Result to aim for: the combined sections behave as one coherent website.
Illustrative workflow. No live AI connection.
01 / Two starting points
Are you adapting one project or assembling several inputs?
A complete template gives you one website with sections and shared styles already connected. A section library lets you choose separate pieces, but someone must combine their styles, links and scripts. For a first website, choose the complete design if it already has the sections you need.
02 / Responsibilities
What do you gain, and what must you still reconcile?
With a complete template, you can focus on replacing the sample content and adapting the design. With separate sections, you also choose the order and make their code work together. The table compares that editing work so you can choose what fits your current project.
Your decision
What to check
OneDollarStock
Content sequence
Full project: existing sequence to keep or adapt
Sections: define the page sequence
Shared styles
Inspect the project’s existing rules
Reconcile type, spacing and colour roles
Behaviour and services
Test existing interactions and missing destinations
Resolve identifiers, scripts and integration points
AI ChatWorkflow example
Combine sections in one page
You
Combine these sections in my existing project. Check conflicting CSS classes, duplicate IDs, image paths and JavaScript before editing.
AI · example response
I will inspect their formats and dependencies, then propose shared styles and unique identifiers. Similar-looking sections may still need code changes to work together.
You
Use this section order and keep the navigation working. Show the merged page at phone and desktop widths.
Steps to take
Inspect compatibility
Compare formats, CSS, scripts and file references.
Integrate the sections
Unify styles and identifiers within the chosen page.
Test the full page
Check navigation, buttons, images and mobile behaviour together.
Result to aim for: the combined sections behave as one coherent website.
Illustrative workflow. No live AI connection.
03 / Source compatibility
What can clash when sections enter one project?
Two sections may use the same CSS class for different styles, repeat an ID or expect different JavaScript and file paths. Ask your agent to inspect those conflicts before combining them, then check the merged page’s menu, buttons and mobile layout.
Checked locally on this device; nothing is submitted.
Interface
Source
Actual direct correction
Limit
Two modules use the same ID
features id="learn"; contact id="learn"
Assigned unique features/contact IDs and linked each action to its intended section.
Source correction; not a working contact service.
Shared global button rule
.button purple; later .button green
Scoped the intended colours to .lab-hero and .lab-features instead of relying on declaration accident.
One deliberately authored conflict, not a library quality ranking.
Before · conflicting global rule and IDs
New original English teaching fragments. These deliberate conflicts do not describe any vendor library; no operational service is included.Open full preview ↗
After · scoped rules and explicit destinations
New original English teaching fragments. These deliberate conflicts do not describe any vendor library; no operational service is included.Open full preview ↗
My section interface register
Prepared original worksheet with a fictional teaching example. Replace it with your approved inputs; copy/download is local and does not grant rights, approval or a working service.
04 / Resource formats
Do GetLayers, Refero Styles and BYQ sell the same input?
No. Their official descriptions cover different materials: GetLayers includes recreation prompts and code depending on the category; Refero Styles describes visual rules; BYQ offers templates, sections, wireframes and styles. Compare the actual product format and plan, not only a similar preview image.
GetLayers
Reconstruction prompts plus category-specific source; its docs describe qualifying Next.js templates and sections. Check the selected plan and item.
Refero Styles
Visual style records describing typography, palette, spacing and components. Style context is different from a complete editable page.
BYQ
Full templates, sections, skeletons and style resources. Compare the selected source format separately from native Webflow CMS or commerce features.
Read index.html, RECREATE.md and the assets in this folder. Tell me where the headline, images and contact links are before editing.
AI · example response
I will inspect the files and list the sections, image paths and links. I will also identify any form that only demonstrates an action.
You
Use the existing HTML. My business copy and images are in the materials folder.
AI · example response
I will match those materials to the existing sections and ask about missing content rather than invent it.
Steps to take
Open the folder
Unzip the project and give the agent access to it.
Inspect the page
Read the HTML and instructions before replacing content.
Add your materials
Supply your copy, images and actual contact destination.
Result to aim for: the agent works on your actual website files.
Illustrative workflow. No live AI connection.
05 / Files and scope
What does a OneDollarStock full project contain?
You receive the website HTML and its RECREATE.md instructions; extra assets vary by product. Open the supplied page as your starting design and ask AI to personalise it. It is a website project, not an account system, CMS or a financial application shown in sample copy.
Website files + design instructions
Existing source and guide
The inspected examples include index.html and RECREATE.md. Companion files vary by product; some images or fonts remain remote.
Your separate setup
Use your own file-capable editing tool. AI access, domain, hosting and operational services are separate.
06 / See an edit
Can you adapt a coherent page without assembling every section?
Yes. Start with the whole template and ask AI to replace your copy and images or adjust the styles. The prepared Formwell example below changes spacing within one complete project. You can also ask to remove sections you do not need; real connected services are configured separately.
›_ AI editing exampleFormwell
You
Add breathing room to Formwell’s sections and limit the opening heading width. Keep the wording and links.
AI · example response
This prepared layout example illustrates spacing changes. Compare the actual result at the viewports you will support.
Prepared conversation and project versions. No live AI connection.
07 / Choose a design
Which whole project fits the content you need?
Choose the project whose existing sections fit your offer and materials. Orbit suits service expertise; Primefolio presents work; Clearstead and Veyra show product concepts. If you need a combination none of them provides, plan a custom layout or integrate separate sections with your agent.
Clearstead
Planning-product presentation with steps and scenarios; data storage is not included.
OneDollarStock is implementing a project to prepare the platform for entry into the German market under the “Go Global” acceleration track of the “Unicorn Hub Startup Booster” programme, project no. FENG.02.28-IP.02-0013/23. The project is co-financed by the European Funds for Smart Economy 2021–2027 under the priority “Innovation-friendly environment”, Measure FENG.2.28 Startup Booster Poland.
Learn more about the project →
