CTGCode
ES
Start your project

template 03 · startups and products

The site for what still needs explaining

A new product has a problem a restaurant does not: nobody knows what it is. This base tells the problem before the feature, orders the plans without confusing anyone, and answers the objections before asking for a sign-up.

01/who it is for

When the product does not explain itself yet

The visitor is not searching for your category: they arrive with a problem, and you have to show them this solves it.

  1. SaaS

    The structure forces you to put the problem ahead of the feature list. That is the order that converts.

  2. Mobile apps

    The “how it works” steps clear away the question that stalls the download: what happens after installing it.

  3. Launches

    There is a social-proof block near the top for however much you have: users, a waiting list, an outlet that mentioned you.

  4. Digital products

    The pricing block orders the plans without confusion, and the FAQ settles the objection right before the sign-up.

02/what is inside

Eight pieces in the order that convinces

The journey is built as an argument: first the problem, then the solution, then the proof, and the price last.

Sections

  1. Navigation bar

    Links to every section and the sign-up or trial button always within reach.

  2. Header with social proof

    A headline with an accented fragment, subhead, two buttons and a line of social proof right below them.

  3. Features

    A grid with icon, title and explanation per feature, written in terms of what it solves rather than what it does.

  4. How it works

    Numbered steps, from sign-up to the first useful result.

  5. Pricing

    Plans side by side, with what each one includes and one flagged as recommended.

  6. Frequently asked questions

    An accordion settling the usual objections before asking for the sign-up.

  7. Closing call to action

    One last block for whoever read all the way down.

  8. Footer

    Links, social profiles and copyright notice.

Built with

  • Astro
  • Tailwind
  • Lucide

Static output: the site compiles to HTML and is served as is, with no JavaScript framework in the browser. Icons are generated as SVG at build time, so they cost no request.

03/measured

What it scores before you touch it

This template does not have a product in production yet, and we are not going to invent one. What gets measured here is its own demo: the same code you receive, with the eight sections, the pricing table and the questions accordion. A real product content will change the words, not the base.

Visit the siteSee the demo
Performance · mobile
92 – 97
Performance · desktop
96 – 100
Accessibility
100
Best practices
100

Measured with Lighthouse 13.4.1 against the demo on 1 August 2026: three mobile runs and three desktop runs, discarding a warm-up pass. We publish the observed range, not the best run. Largest contentful paint came in at 1.9–2.9 s on mobile and 0.6–1.3 s on desktop. The SEO score is left out because the demo ships with noindex on purpose — it simulates a product that does not exist — and Lighthouse penalises it for that alone; every other SEO audit passes.

04/the engagement

What you get for that price

The site published and running, not a folder somebody still has to upload. This is what goes in.

  • .com domain, first year

    We register and configure it in your name. From the second year the renewal is yours, paid straight to the provider with no commission from us.

  • Hosting, first year

    Hosting with HTTPS and certificate. Same rule as the domain: the second year is on you.

  • Contact form, connected

    Messages reach your inbox through a Formspree account set up with your details. No server to maintain.

  • Direct WhatsApp contact

    A button that opens a conversation with your number, reachable from anywhere on the page.

  • We load your content

    We place the copy, photos and details you send us, and we tell you beforehand if something will not look right: an image too small, a logo without a transparent background, a line that will not fit.

  • Full technical SEO

    Everything that is solved in the code: tags, structured data, sitemap, canonicals, speed and accessibility.

  • Two rounds of minor changes

    Within the first thirty days, to tune whatever reads differently once it is live.

  • Thirty-day warranty

    We fix any programming or environment-configuration error at no cost. After that, support is optional and can be contracted.

05/the boundary

How far a template goes

A template is a base already built to speed the work up, not a rigid mould. But it has a limit, and we would rather state it before quoting than after starting.

Included in the price

  • Colours, typefaces and logo
  • All the copy, from the header to the footer
  • Your photos, your icons and your favicon
  • Reordering or hiding the sections it already ships with
  • As many items as you like inside an existing section
  • Contact details, opening hours and social profiles

Now it is custom development

  • A section the template does not have
  • A second page: blog, portfolio, service detail pages
  • A shop, cart or online payments
  • Bookings, scheduling or real-time availability
  • A private area, login or admin panel
  • A content manager so you can edit it yourself
  • Integration with a CRM, an ERP or an external API

Nothing on the right is a no: it is a separate quote. It gets built on top of this same base, without throwing away what is done.

Nothing in that second list is a no: it is a separate quote. It gets built on top of this same base, without throwing away what is done.

Price · Delivery

Price

$1,600,000 – $2,400,000 COP

USD $640 – $950

Converted at the 31 July 2026 rate, transfer costs already included. The price in Colombian pesos is the governing one.

Delivery

5 – 8 business days

The clock starts when payment is confirmed and everything needed to customise it has reached us: logo, colours, typefaces, copy, product screenshots, the plans with their prices and contact details.

07/questions

What people ask before deciding

Does the pricing block connect to a payment gateway?

No. The plans are displayed and each button goes wherever you say: a sign-up, an email, a WhatsApp chat or your own application. Connecting a payment gateway and charging from the page is custom development and is quoted separately.

Can I put client or press logos in the social proof?

Yes, as long as you have permission to use them. It is the only part of the page whose content does not depend on you alone, so it is worth settling before we start. If there are no logos yet, the block works just as well with a figure or a sentence.

How many plans fit in the pricing section?

Three read comfortably and that is what we recommend. At four it starts to squeeze on small screens. If you need more plans, or a comparison table of features, that is custom development.

What if the product does not exist yet?

That is not a problem: the template is meant for exactly that — explaining something that still needs explaining, validating interest or collecting a waiting list. What you do need to be clear on is what problem you solve and for whom; without that, no page works.

What if I do not have the copy or product screenshots?

We place whatever you send us, and we tell you beforehand if something will not look right: a low-resolution screenshot, a line that will not fit where it goes. Producing the screenshots and writing the copy are not included in the price; if you already have them ready, placing them costs nothing extra.

Can I move to something bigger later?

Yes. It is a static Astro site with no strings attached: when the product calls for an application, a dashboard or a blog, it gets built on top without throwing away what you have. And if you would rather do it with another team, the code is yours from the day it ships.

the other two

If this one is not yours

Esta página también está disponible en español.

Ver en español

We use cookies to measure traffic and improve the site. Nothing runs until you decide.