276 lines
16 KiB
PHP
276 lines
16 KiB
PHP
<?php
|
|
// Fetch images from Pexels API
|
|
$api_url = 'http://' . $_SERVER['HTTP_HOST'] . '/api/pexels.php?action=multiple&queries=marketing,social%20media,analytics,creative,dashboard';
|
|
$images_json = @file_get_contents($api_url);
|
|
$images = $images_json ? json_decode($images_json, true) : [];
|
|
|
|
function get_image($index, $fallback_url) {
|
|
global $images;
|
|
return htmlspecialchars($images[$index]['src'] ?? $fallback_url);
|
|
}
|
|
|
|
$hero_image = get_image(0, 'https://picsum.photos/1200/800');
|
|
$about_image = get_image(1, 'https://picsum.photos/600/400');
|
|
$portfolio_images = [
|
|
get_image(2, 'https://picsum.photos/600/400?random=1'),
|
|
get_image(3, 'https://picsum.photos/600/400?random=2'),
|
|
get_image(4, 'https://picsum.photos/600/400?random=3'),
|
|
];
|
|
?>
|
|
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
|
<!-- SEO Meta Tags -->
|
|
<title>nomara - AI-Powered Marketing</title>
|
|
<meta name="description" content="AI-Powered Marketing Portal and Public Website built with Flatlogic Generator.">
|
|
<meta name="keywords" content="ai marketing, social media automation, client portal, content calendar, digital marketing, saas, marketing analytics, flatlogic">
|
|
|
|
<!-- Open Graph / Facebook -->
|
|
<meta property="og:type" content="website">
|
|
<meta property="og:title" content="nomara - AI-Powered Marketing">
|
|
<meta property="og:description" content="AI-Powered Marketing Portal and Public Website built with Flatlogic Generator.">
|
|
<meta property="og:image" content="<?php echo htmlspecialchars($_SERVER['PROJECT_IMAGE_URL'] ?? ''); ?>">
|
|
|
|
<!-- Twitter -->
|
|
<meta name="twitter:card" content="summary_large_image">
|
|
<meta name="twitter:title" content="nomara - AI-Powered Marketing">
|
|
<meta name="twitter:description" content="AI-Powered Marketing Portal and Public Website built with Flatlogic Generator.">
|
|
<meta name="twitter:image" content="<?php echo htmlspecialchars($_SERVER['PROJECT_IMAGE_URL'] ?? ''); ?>">
|
|
|
|
<!-- Stylesheets -->
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
|
|
<link rel="stylesheet" href="assets/css/custom.css?v=<?php echo time(); ?>">
|
|
|
|
<!-- Icons -->
|
|
<script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
|
|
<style>
|
|
#hero {
|
|
position: relative;
|
|
background-image: url('<?php echo $hero_image; ?>');
|
|
background-size: cover;
|
|
background-position: center;
|
|
color: white;
|
|
}
|
|
.hero-overlay {
|
|
position: relative;
|
|
z-index: 1;
|
|
background-color: rgba(0, 0, 0, 0.5);
|
|
padding: 6rem 0;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<header class="sticky-top">
|
|
<nav class="navbar navbar-expand-lg navbar-light">
|
|
<div class="container">
|
|
<a class="navbar-brand" href="#">nomara</a>
|
|
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
|
<span class="navbar-toggler-icon"></span>
|
|
</button>
|
|
<div class="collapse navbar-collapse" id="navbarNav">
|
|
<ul class="navbar-nav ms-auto">
|
|
<li class="nav-item"><a class="nav-link" href="#about">About</a></li>
|
|
<li class="nav-item"><a class="nav-link" href="#portfolio">Portfolio</a></li>
|
|
<li class="nav-item"><a class="nav-link" href="#pricing">Pricing</a></li>
|
|
<li class="nav-item"><a class="nav-link" href="#testimonials">Testimonials</a></li>
|
|
<li class="nav-item"><a class="nav-link" href="#contact">Contact</a></li>
|
|
</ul>
|
|
<div class="d-flex align-items-center ms-lg-3">
|
|
<a href="/login.php" class="btn btn-outline-secondary me-2">Login</a>
|
|
<a href="/register.php" class="btn btn-primary">Register</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
</header>
|
|
|
|
<main>
|
|
<!-- Hero Section -->
|
|
<section id="hero" class="text-center">
|
|
<div class="hero-overlay">
|
|
<div class="container">
|
|
<h1 class="display-3">Automate Your Marketing with AI</h1>
|
|
<p class="lead col-lg-8 mx-auto">We build intelligent systems to scale your social media, content creation, and client management. Focus on strategy, not busywork.</p>
|
|
<a href="#contact" class="btn btn-primary btn-lg mt-4">Get a Demo</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- About Section -->
|
|
<section id="about">
|
|
<div class="container">
|
|
<h2 class="text-center">The Future of Agency Operations</h2>
|
|
<div class="row mt-5 align-items-center">
|
|
<div class="col-lg-6">
|
|
<h3>A Central Hub for Growth</h3>
|
|
<p>Our platform provides a unified portal for your team and clients. Manage projects, approve content, and track performance—all in one place. We integrate with the tools you already love, like Stripe, Calendly, and Meta Ads, to create seamless, automated workflows.</p>
|
|
</div>
|
|
<div class="col-lg-6 text-center">
|
|
<img src="<?php echo $about_image; ?>" class="img-fluid rounded shadow-sm" alt="Marketing Professionals Collaborating">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Portfolio Section -->
|
|
<section id="portfolio" class="bg-white">
|
|
<div class="container">
|
|
<h2 class="text-center">Our Work</h2>
|
|
<div class="row g-4 mt-4">
|
|
<div class="col-md-4"><div class="card h-100"><img src="<?php echo $portfolio_images[0]; ?>" class="card-img-top" alt="Social Media Growth Project"><div class="card-body"><h5 class="card-title">Client A</h5><p class="card-text">Social Media Growth</p></div></div></div>
|
|
<div class="col-md-4"><div class="card h-100"><img src="<?php echo $portfolio_images[1]; ?>" class="card-img-top" alt="Content Automation Project"><div class="card-body"><h5 class="card-title">Client B</h5><p class="card-text">Content Automation</p></div></div></div>
|
|
<div class="col-md-4"><div class="card h-100"><img src="<?php echo $portfolio_images[2]; ?>" class="card-img-top" alt="Ad Campaign Management Project"><div class="card-body"><h5 class="card-title">Client C</h5><p class="card-text">Ad Campaign Management</p></div></div></div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Pricing Section -->
|
|
<section id="pricing">
|
|
<div class="container">
|
|
<h2 class="text-center">Simple, Transparent Pricing</h2>
|
|
<p class="text-center text-muted mb-5">Choose the plan that's right for your business. All prices are placeholders.</p>
|
|
<div class="row">
|
|
<!-- Plan 1 -->
|
|
<div class="col-lg-4">
|
|
<div class="card mb-5 mb-lg-0 h-100">
|
|
<div class="card-body d-flex flex-column">
|
|
<h5 class="card-title text-muted text-uppercase text-center">Starter</h5>
|
|
<h6 class="card-price text-center">$99<span class="period">/month</span></h6>
|
|
<hr>
|
|
<ul class="fa-ul">
|
|
<li><span class="fa-li"><i class="fas fa-check"></i></span>1 Client Portal</li>
|
|
<li><span class="fa-li"><i class="fas fa-check"></i></span>Content Calendar</li>
|
|
<li><span class="fa-li"><i class="fas fa-check"></i></span>Basic Reporting</li>
|
|
<li class="text-muted"><span class="fa-li"><i class="fas fa-times"></i></span>AI Content Generation</li>
|
|
<li class="text-muted"><span class="fa-li"><i class="fas fa-times"></i></span>Ad Integration</li>
|
|
<li class="text-muted"><span class="fa-li"><i class="fas fa-times"></i></span>Dedicated Support</li>
|
|
</ul>
|
|
<div class="d-grid mt-auto">
|
|
<a href="#" class="btn btn-outline-primary text-uppercase">Choose Plan</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Plan 2 -->
|
|
<div class="col-lg-4">
|
|
<div class="card mb-5 mb-lg-0 card-popular h-100">
|
|
<div class="card-body d-flex flex-column">
|
|
<h5 class="card-title text-muted text-uppercase text-center">Pro</h5>
|
|
<h6 class="card-price text-center">$299<span class="period">/month</span></h6>
|
|
<hr>
|
|
<ul class="fa-ul">
|
|
<li><span class="fa-li"><i class="fas fa-check"></i></span>10 Client Portals</li>
|
|
<li><span class="fa-li"><i class="fas fa-check"></i></span>Content Calendar</li>
|
|
<li><span class="fa-li"><i class="fas fa-check"></i></span>Advanced Reporting</li>
|
|
<li><span class="fa-li"><i class="fas fa-check"></i></span>AI Content Generation</li>
|
|
<li><span class="fa-li"><i class="fas fa-check"></i></span>Ad Integration</li>
|
|
<li class="text-muted"><span class="fa-li"><i class="fas fa-times"></i></span>Dedicated Support</li>
|
|
</ul>
|
|
<div class="d-grid mt-auto">
|
|
<a href="#" class="btn btn-primary text-uppercase">Choose Plan</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Plan 3 -->
|
|
<div class="col-lg-4">
|
|
<div class="card h-100">
|
|
<div class="card-body d-flex flex-column">
|
|
<h5 class="card-title text-muted text-uppercase text-center">Enterprise</h5>
|
|
<h6 class="card-price text-center">$599+<span class="period">/month</span></h6>
|
|
<hr>
|
|
<ul class="fa-ul">
|
|
<li><span class="fa-li"><i class="fas fa-check"></i></span>Unlimited Client Portals</li>
|
|
<li><span class="fa-li"><i class="fas fa-check"></i></span>Content Calendar</li>
|
|
<li><span class="fa-li"><i class="fas fa-check"></i></span>Advanced Reporting</li>
|
|
<li><span class="fa-li"><i class="fas fa-check"></i></span>AI Content Generation</li>
|
|
<li><span class="fa-li"><i class="fas fa-check"></i></span>Ad Integration</li>
|
|
<li><span class="fa-li"><i class="fas fa-check"></i></span>Dedicated Support</li>
|
|
</ul>
|
|
<div class="d-grid mt-auto">
|
|
<a href="#" class="btn btn-outline-primary text-uppercase">Choose Plan</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Testimonials Section -->
|
|
<section id="testimonials">
|
|
<div class="container">
|
|
<h2 class="text-center">What Our Clients Say</h2>
|
|
<div class="row mt-5">
|
|
<div class="col-md-6 col-lg-4 mb-4">
|
|
<div class="card p-4 text-center h-100">
|
|
<p>"Working with this team has been a game-changer. Our efficiency has skyrocketed."</p>
|
|
<footer class="blockquote-footer mt-auto">Jane Doe, CEO of Company</footer>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 col-lg-4 mb-4">
|
|
<div class="card p-4 text-center h-100">
|
|
<p>"The client portal is intuitive and saves us countless hours of back-and-forth."</p>
|
|
<footer class="blockquote-footer mt-auto">John Smith, Marketing Director</footer>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-12 col-lg-4 mb-4">
|
|
<div class="card p-4 text-center h-100">
|
|
<p>"Finally, a single source of truth for all our marketing activities. Highly recommended."</p>
|
|
<footer class="blockquote-footer mt-auto">Sam Wilson, Founder</footer>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Contact Section -->
|
|
<section id="contact" class="bg-white">
|
|
<div class="container">
|
|
<h2 class="text-center">Let's Connect</h2>
|
|
<div class="row justify-content-center">
|
|
<div class="col-lg-6">
|
|
<p class="text-center mb-4">Fill out the form below to schedule a demo and learn how we can help you scale.</p>
|
|
<div id="form-feedback"></div>
|
|
<form id="contactForm">
|
|
<div class="mb-3">
|
|
<label for="name" class="form-label">Full Name</label>
|
|
<input type="text" class="form-control" id="name" name="name" required>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="email" class="form-label">Email Address</label>
|
|
<input type="email" class="form-control" id="email" name="email" required>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="message" class="form-label">Message</label>
|
|
<textarea class="form-control" id="message" name="message" rows="5" required></textarea>
|
|
</div>
|
|
<div class="d-grid">
|
|
<button type="submit" class="btn btn-primary btn-lg">Send Message</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
|
|
<footer class="text-center">
|
|
<div class="container">
|
|
<p class="mb-0">© <?php echo date("Y"); ?> nomara. All Rights Reserved. | <a href="privacy.php">Privacy Policy</a></p>
|
|
</div>
|
|
</footer>
|
|
|
|
<!-- Scripts -->
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
|
|
<script src="assets/js/main.js?v=<?php echo time(); ?>"></script>
|
|
<script>
|
|
feather.replace()
|
|
</script>
|
|
</body>
|
|
</html>
|