new section are updated
This commit is contained in:
parent
7a60622b4b
commit
a491ec6923
@ -1304,15 +1304,16 @@ only screen and (min-width: 576px) and (max-width: 767px) {
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
/*
|
||||
.bd-loader {
|
||||
margin-left: 92px;
|
||||
}
|
||||
} */
|
||||
|
||||
@media only screen and (min-width: 576px) and (max-width: 767px),
|
||||
(max-width: 575px) {
|
||||
.bd-loader {
|
||||
transform: scale(0.8);
|
||||
margin-left: 66px;
|
||||
/* margin-left: 66px; */
|
||||
}
|
||||
}
|
||||
|
||||
@ -2800,7 +2801,7 @@ ul.footer-contact-info-widget .icon {
|
||||
/*----------------------------------------*/
|
||||
|
||||
.banner-main {
|
||||
padding: 210px 0px;
|
||||
padding: 350px 0 210px 0;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
@ -2818,7 +2819,7 @@ ul.footer-contact-info-widget .icon {
|
||||
|
||||
.banner-area {
|
||||
max-width: 1075px;
|
||||
/* padding-left: 70px; */
|
||||
padding-left: 70px;
|
||||
}
|
||||
|
||||
.banner-sub-title {
|
||||
@ -2829,7 +2830,7 @@ ul.footer-contact-info-widget .icon {
|
||||
line-height: 32px;
|
||||
letter-spacing: 9px;
|
||||
text-transform: uppercase;
|
||||
margin-left: 5px;
|
||||
margin-left: 40px;
|
||||
}
|
||||
|
||||
.banner-sub-title:before {
|
||||
@ -3186,13 +3187,9 @@ p.banner-text {
|
||||
max-width: 64px;
|
||||
}
|
||||
|
||||
.about-us-content-area .icon img {
|
||||
filter: initial;
|
||||
}
|
||||
|
||||
.about-us-content-area:hover .icon img {
|
||||
filter: grayscale(100%) brightness(300%);
|
||||
}
|
||||
/* .about-us-content-area .icon img {
|
||||
filter: brightness(0) invert(1) !important;
|
||||
} */
|
||||
|
||||
.about-us-content-area .icon:before {
|
||||
content: "";
|
||||
@ -3211,6 +3208,12 @@ p.banner-text {
|
||||
transform: scale(1, 1);
|
||||
}
|
||||
|
||||
.about-us-content-area .icon-box:hover .icon img {
|
||||
filter: brightness(0) invert(1) !important;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.about-us-content-area .icon-box:hover .icon i {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
|
||||
BIN
public/assets/images/blog/blog-cards/feb-27-card.webp
Normal file
BIN
public/assets/images/blog/blog-cards/feb-27-card.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 9.1 KiB |
BIN
public/assets/images/blog/blog-cards/feb-28-card.webp
Normal file
BIN
public/assets/images/blog/blog-cards/feb-28-card.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
BIN
public/assets/images/blog/blog-details/feb-27-big-img.webp
Normal file
BIN
public/assets/images/blog/blog-details/feb-27-big-img.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
public/assets/images/blog/blog-details/feb-28-big-img.webp
Normal file
BIN
public/assets/images/blog/blog-details/feb-28-big-img.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 25 KiB |
@ -15,15 +15,15 @@
|
||||
|
||||
// Defaults
|
||||
var settings = $.extend({
|
||||
'time': 400,
|
||||
'delay': 10,
|
||||
'offset': 100,
|
||||
'beginAt': 0,
|
||||
'formatter': false,
|
||||
'context': 'window',
|
||||
callback: function () {
|
||||
}
|
||||
}, options),
|
||||
'time': 400,
|
||||
'delay': 10,
|
||||
'offset': 100,
|
||||
'beginAt': 0,
|
||||
'formatter': false,
|
||||
'context': 'window',
|
||||
callback: function () {
|
||||
}
|
||||
}, options),
|
||||
s;
|
||||
|
||||
return this.each(function () {
|
||||
@ -114,8 +114,8 @@
|
||||
// Perform counts when the element gets into view
|
||||
$this.waypoint(function (direction) {
|
||||
counterUpper();
|
||||
this.destroy(); //-- Waypoint 3.0 version of triggerOnce
|
||||
}, {offset: counter.offset + "%", context: counter.context});
|
||||
// Removed this.destroy() to allow re-triggering as requested by user
|
||||
}, { offset: counter.offset + "%", context: counter.context });
|
||||
});
|
||||
|
||||
};
|
||||
|
||||
@ -188,14 +188,59 @@ window.initMetatron = function () {
|
||||
});
|
||||
|
||||
/*======================================
|
||||
Counter Js
|
||||
Counter Js (Robust Re-triggering)
|
||||
========================================*/
|
||||
if ($.fn.counterUp) {
|
||||
$(".counter").counterUp({
|
||||
delay: 10,
|
||||
time: 1000,
|
||||
const initCounters = () => {
|
||||
const counterElements = document.querySelectorAll('.counter');
|
||||
|
||||
const animateCounter = (el) => {
|
||||
const target = parseFloat(el.dataset.target.replace(/,/g, ''));
|
||||
if (isNaN(target)) return;
|
||||
|
||||
const duration = 2000;
|
||||
const stepTime = 20;
|
||||
const steps = duration / stepTime;
|
||||
const increment = target / steps;
|
||||
let current = 0;
|
||||
|
||||
const timer = setInterval(() => {
|
||||
current += increment;
|
||||
if (current >= target) {
|
||||
el.innerText = target.toLocaleString() + (el.dataset.suffix || '');
|
||||
clearInterval(timer);
|
||||
} else {
|
||||
el.innerText = Math.floor(current).toLocaleString() + (el.dataset.suffix || '');
|
||||
}
|
||||
}, stepTime);
|
||||
el.dataset.counterTimer = timer;
|
||||
};
|
||||
|
||||
const observer = new IntersectionObserver((entries) => {
|
||||
entries.forEach(entry => {
|
||||
const el = entry.target;
|
||||
if (entry.isIntersecting) {
|
||||
if (el.dataset.counterTimer) clearInterval(el.dataset.counterTimer);
|
||||
animateCounter(el);
|
||||
} else {
|
||||
if (el.dataset.counterTimer) clearInterval(el.dataset.counterTimer);
|
||||
el.innerText = '0' + (el.dataset.suffix || '');
|
||||
}
|
||||
});
|
||||
}, { threshold: 0.1 });
|
||||
|
||||
counterElements.forEach(el => {
|
||||
const text = el.innerText;
|
||||
const match = text.match(/([\d,.]+)(\+?)/);
|
||||
if (match) {
|
||||
el.dataset.target = match[1];
|
||||
el.dataset.suffix = match[2] || '';
|
||||
} else {
|
||||
el.dataset.target = text;
|
||||
}
|
||||
observer.observe(el);
|
||||
});
|
||||
}
|
||||
};
|
||||
initCounters();
|
||||
|
||||
/*======================================
|
||||
Wow Js
|
||||
@ -623,6 +668,31 @@ window.initMetatron = function () {
|
||||
});
|
||||
}
|
||||
|
||||
if ($('.service-one-home__carousel').length > 0) {
|
||||
new Swiper('.service-one-home__carousel', {
|
||||
slidesPerView: 3,
|
||||
spaceBetween: 30,
|
||||
loop: true,
|
||||
roundLengths: true,
|
||||
autoplay: {
|
||||
delay: 3000,
|
||||
},
|
||||
pagination: {
|
||||
el: ".bd-swiper-dot",
|
||||
clickable: true,
|
||||
},
|
||||
breakpoints: {
|
||||
'1400': { slidesPerView: 3 },
|
||||
'1200': { slidesPerView: 3 },
|
||||
'992': { slidesPerView: 2 },
|
||||
'768': { slidesPerView: 1 },
|
||||
'576': { slidesPerView: 1 },
|
||||
'0': { slidesPerView: 1 },
|
||||
},
|
||||
speed: 1500,
|
||||
});
|
||||
}
|
||||
|
||||
/*======================================
|
||||
slider Js
|
||||
========================================*/
|
||||
|
||||
@ -0,0 +1,36 @@
|
||||
"use client";
|
||||
|
||||
import React, { useEffect } from "react";
|
||||
import Header1 from "@/components/layout/Header1";
|
||||
import Footer1 from "@/components/layout/Footer1";
|
||||
import PageHeader from "@/components/common/PageHeader";
|
||||
import AccessibilityContent from "@/components/accessibility/AccessibilityContent";
|
||||
|
||||
export default function AccessibilityStatement() {
|
||||
useEffect(() => {
|
||||
const init = () => {
|
||||
if (typeof window !== "undefined" && (window as any).initMetatron && (window as any).jQuery) {
|
||||
(window as any).initMetatron();
|
||||
} else {
|
||||
setTimeout(init, 100);
|
||||
}
|
||||
};
|
||||
init();
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<>
|
||||
<Header1 />
|
||||
<main>
|
||||
<PageHeader
|
||||
title="Accessibility Statement"
|
||||
breadcrumbItems={[{ name: "Accessibility Statement" }]}
|
||||
bannerLeftImage="/assets/images/innerbanner/left/left-about.webp"
|
||||
bannerRightImage="/assets/images/innerbanner/right/right-about.webp"
|
||||
/>
|
||||
<AccessibilityContent />
|
||||
</main>
|
||||
<Footer1 />
|
||||
</>
|
||||
);
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
@ -17,6 +17,7 @@ import CounterAreaTwo from "@/components/home/CounterAreaTwo";
|
||||
import MedicalServices from "@/components/home/MedicalServices";
|
||||
import HomeContactOne from "@/components/home/HomeContactOne";
|
||||
import MetatronInitializer from "@/components/MetatronInitializer";
|
||||
import HomeServiceOne from "@/components/home/HomeServiceOne";
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Metatroncube: Leaders in Web & Mobile Dev, SEO, Digital Marketing",
|
||||
@ -36,11 +37,12 @@ export default function MainPage() {
|
||||
<AboutSection />
|
||||
<ChooseSection />
|
||||
<CounsellingSolutions />
|
||||
<MedicalServices />
|
||||
{/* <MedicalServices /> */}
|
||||
<BrandSection />
|
||||
<CallAreaThree />
|
||||
<CounterAreaTwo />
|
||||
<ServiceThreeSlider />
|
||||
{/* <ServiceThreeSlider /> */}
|
||||
<HomeServiceOne/>
|
||||
<CtaSection />
|
||||
<TestimonialsSection />
|
||||
<HomeContactOne />
|
||||
|
||||
36
src/app/privacy-policy/page.tsx
Normal file
36
src/app/privacy-policy/page.tsx
Normal file
@ -0,0 +1,36 @@
|
||||
"use client";
|
||||
|
||||
import React, { useEffect } from "react";
|
||||
import Header1 from "@/components/layout/Header1";
|
||||
import Footer1 from "@/components/layout/Footer1";
|
||||
import PageHeader from "@/components/common/PageHeader";
|
||||
import PrivacyPolicyContent from "@/components/privacy/PrivacyPolicyContent";
|
||||
|
||||
export default function PrivacyPolicy() {
|
||||
useEffect(() => {
|
||||
const init = () => {
|
||||
if (typeof window !== "undefined" && (window as any).initMetatron && (window as any).jQuery) {
|
||||
(window as any).initMetatron();
|
||||
} else {
|
||||
setTimeout(init, 100);
|
||||
}
|
||||
};
|
||||
init();
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<>
|
||||
<Header1 />
|
||||
<main>
|
||||
<PageHeader
|
||||
title="Privacy Policy"
|
||||
breadcrumbItems={[{ name: "Privacy Policy" }]}
|
||||
bannerLeftImage="/assets/images/innerbanner/left/left-about.webp"
|
||||
bannerRightImage="/assets/images/innerbanner/right/right-about.webp"
|
||||
/>
|
||||
<PrivacyPolicyContent />
|
||||
</main>
|
||||
<Footer1 />
|
||||
</>
|
||||
);
|
||||
}
|
||||
64
src/components/accessibility/AccessibilityContent.tsx
Normal file
64
src/components/accessibility/AccessibilityContent.tsx
Normal file
@ -0,0 +1,64 @@
|
||||
import React from "react";
|
||||
|
||||
const AccessibilityContent = () => {
|
||||
return (
|
||||
<section className="accessibility-section">
|
||||
<div className="small-container">
|
||||
<div className="row">
|
||||
<div className="col-12">
|
||||
<div className="accessibility-content">
|
||||
<h2>Accessibility Statement</h2>
|
||||
<h3>Powered by</h3>
|
||||
<div className="mt-4">
|
||||
<img
|
||||
src="https://i0.wp.com/metatroncubesolutions.com/wp-content/uploads/2024/04/accessibe.webp?w=500&ssl=1"
|
||||
alt="accessiBe"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<h3>Compliance status</h3>
|
||||
<p>We firmly believe that the internet should be available and accessible to anyone and are committed to providing a website that is accessible to the broadest possible audience, regardless of ability.</p>
|
||||
<p>To fulfill this, we aim to adhere as strictly as possible to the World Wide Web Consortium's (W3C) Web Content Accessibility Guidelines 2.1 (WCAG 2.1) at the AA level. These guidelines explain how to make web content accessible to people with a wide array of disabilities.</p>
|
||||
<p>Complying with those guidelines helps us ensure that the website is accessible to blind people, people with motor impairments, visual impairment, cognitive disabilities, and more. This website utilizes various technologies that are meant to make it as accessible as possible at all times.</p>
|
||||
<p>We utilize an accessibility interface that allows persons with specific disabilities to adjust the website's UI (user interface) and design it to their personal needs. Additionally, the website utilizes an AI-based application that runs in the background and optimizes its accessibility level constantly.</p>
|
||||
<p>This application remediates the website's HTML, adapts its functionality and behavior for screen-readers used by blind users, and for keyboard functions used by individuals with motor impairments. If you wish to contact the website's owner please use the following email <a href="mailto:info@metatroncubesolutions.com">info@metatroncubesolutions.com</a></p>
|
||||
|
||||
<h3>Screen-reader and keyboard navigation</h3>
|
||||
<p>Our website implements the ARIA attributes (Accessible Rich Internet Applications) technique, alongside various behavioral changes, to ensure blind users visiting with screen-readers can read, comprehend, and enjoy the website's functions. As soon as a user with a screen-reader enters your site, they immediately receive a prompt to enter the Screen-Reader Profile so they can browse and operate your site effectively. Here's how our website covers some of the most important screen-reader requirements:</p>
|
||||
|
||||
<ul>
|
||||
<li><strong>Screen-reader optimization:</strong> we run a process that learns the website's components from top to bottom, to ensure ongoing compliance even when updating the website. In this process, we provide screen-readers with meaningful data using the ARIA set of attributes. For example, we provide accurate form labels; descriptions for actionable icons (social media icons, search icons, cart icons, etc.); validation guidance for form inputs; element roles such as buttons, menus, modal dialogues (popups), and others. Additionally, the background process scans all of the website's images. It provides an accurate and meaningful image-object-recognition-based description as an ALT (alternate text) tag for images that are not described. It will also extract texts embedded within the image using an OCR (optical character recognition) technology. To turn on screen-reader adjustments at any time, users need only to press the Alt+1 keyboard combination. Screen-reader users also get automatic announcements to turn the Screen-reader mode on as soon as they enter the website. These adjustments are compatible with popular screen readers such as JAWS, NVDA, VoiceOver, and TalkBack</li>
|
||||
<li><strong>Keyboard navigation optimization:</strong> The background process also adjusts the website's HTML and adds various behaviors using JavaScript code to make the website operable by the keyboard. This includes the ability to navigate the website using the Tab and Shift+Tab keys, operate dropdowns with the arrow keys, close them with Esc, trigger buttons and links using the Enter key, navigate between radio and checkbox elements using the arrow keys, and fill them in with the Spacebar or Enter key. Additionally, keyboard users will find content-skip menus available at any time by clicking Alt+2, or as the first element of the site while navigating with the keyboard. The background process also handles triggered popups by moving the keyboard focus towards them as soon as they appear, not allowing the focus to drift outside. Users can also use shortcuts such as "M" (menus), "H" (headings), "F" (forms), "B" (buttons), and "G" (graphics) to jump to specific elements.</li>
|
||||
<li><strong>Epilepsy Safe Profile:</strong> this profile enables people with epilepsy to safely use the website by eliminating the risk of seizures resulting from flashing or blinking animations and risky color combinations.</li>
|
||||
<li><strong>Vision Impaired Profile:</strong> this profile adjusts the website so that it is accessible to the majority of visual impairments such as Degrading Eyesight, Tunnel Vision, Cataract, Glaucoma, and others.</li>
|
||||
<li><strong>Cognitive Disability Profile:</strong> this profile provides various assistive features to help users with cognitive disabilities such as Autism, Dyslexia, CVA, and others, to focus on the essential elements more easily.</li>
|
||||
<li><strong>ADHD Friendly Profile:</strong> this profile significantly reduces distractions and noise to help people with ADHD, and Neurodevelopmental disorders browse, read, and focus on the essential elements more easily.</li>
|
||||
<li><strong>Blind Users Profile (Screen-readers):</strong> this profile adjusts the website to be compatible with screen-readers such as JAWS, NVDA, VoiceOver, and TalkBack. A screen-reader is installed on the blind user's computer, and this site is compatible with it.</li>
|
||||
<li><strong>Keyboard Navigation Profile (Motor-Impaired):</strong> this profile enables motor-impaired persons to operate the website using the keyboard Tab, Shift+Tab, and the Enter keys. Users can also use shortcuts such as "M" (menus), "H" (headings), "F" (forms), "B" (buttons), and "G" (graphics) to jump to specific elements.</li>
|
||||
</ul>
|
||||
|
||||
<h3>Additional UI, design, and readability adjustments</h3>
|
||||
<ul>
|
||||
<li><strong>Font adjustments</strong> users can increase and decrease its size, change its family (type), adjust the spacing, alignment, line height, and more.</li>
|
||||
<li><strong>Color adjustments</strong> users can select various color contrast profiles such as light, dark, inverted, and monochrome. Additionally, users can swap color schemes of titles, texts, and backgrounds with over seven different coloring options.</li>
|
||||
<li><strong>Animations</strong> epileptic users can stop all running animations with the click of a button. Animations controlled by the interface include videos, GIFs, and CSS flashing transitions.</li>
|
||||
<li><strong>Content highlighting</strong> users can choose to emphasize essential elements such as links and titles. They can also choose to highlight focused or hovered elements only.</li>
|
||||
<li><strong>Audio muting</strong> users with hearing devices may experience headaches or other issues due to automatic audio playing. This option lets users mute the entire website instantly.</li>
|
||||
<li><strong>Cognitive disorders</strong> we utilize a search engine linked to Wikipedia and Wiktionary, allowing people with cognitive disorders to decipher meanings of phrases, initials, slang, and others.</li>
|
||||
<li><strong>Additional functions</strong> we allow users to change cursor color and size, use a printing mode, enable a virtual keyboard, and many other functions.</li>
|
||||
</ul>
|
||||
|
||||
<h3>Assistive technology and browser compatibility</h3>
|
||||
<p>We aim to support as many browsers and assistive technologies as possible, so our users can choose the best fitting tools for them, with as few limitations as possible. Therefore, we have worked very hard to be able to support all major systems that comprise over 95% of the user market share, including Google Chrome, Mozilla Firefox, Apple Safari, Opera and Microsoft Edge, JAWS, and NVDA (screen readers), both for Windows and MAC users.</p>
|
||||
|
||||
<h3>Notes, comments, and feedback</h3>
|
||||
<p>Despite our very best efforts to allow anybody to adjust the website to their needs, there may still be pages or sections that are not fully accessible, are in the process of becoming accessible, or are lacking an adequate technological solution to make them accessible. Still, we are continually improving our accessibility, adding, updating, improving its options and features, and developing and adopting new technologies. All this is meant to reach the optimal level of accessibility following technological advancements. If you wish to contact the website's owner, please use the following email <a href="mailto:info@metatroncubesolutions.com">info@metatroncubesolutions.com</a></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
|
||||
export default AccessibilityContent;
|
||||
@ -8,7 +8,7 @@ const AboutThree = () => {
|
||||
|
||||
useEffect(() => {
|
||||
const observer = new IntersectionObserver((entries) => {
|
||||
if (entries[0].isIntersecting && !hasCounted) {
|
||||
if (entries[0].isIntersecting) {
|
||||
setHasCounted(true);
|
||||
let start = 0;
|
||||
const duration = 1500;
|
||||
@ -22,6 +22,9 @@ const AboutThree = () => {
|
||||
setCount(Math.floor(start));
|
||||
}
|
||||
}, 16);
|
||||
} else {
|
||||
setHasCounted(false);
|
||||
setCount(0);
|
||||
}
|
||||
}, { threshold: 0.5 });
|
||||
|
||||
@ -30,7 +33,7 @@ const AboutThree = () => {
|
||||
}
|
||||
|
||||
return () => observer.disconnect();
|
||||
}, [hasCounted]);
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<section className="about-three">
|
||||
|
||||
@ -15,8 +15,11 @@ const Counter: React.FC<CounterProps> = ({ end, duration = 2000 }) => {
|
||||
useEffect(() => {
|
||||
const observer = new IntersectionObserver(
|
||||
([entry]) => {
|
||||
if (entry.isIntersecting && !hasStarted) {
|
||||
if (entry.isIntersecting) {
|
||||
setHasStarted(true);
|
||||
} else {
|
||||
setHasStarted(false);
|
||||
setCount(0);
|
||||
}
|
||||
},
|
||||
{ threshold: 0.1 }
|
||||
@ -27,21 +30,23 @@ const Counter: React.FC<CounterProps> = ({ end, duration = 2000 }) => {
|
||||
}
|
||||
|
||||
return () => observer.disconnect();
|
||||
}, [hasStarted]);
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
if (!hasStarted) return;
|
||||
|
||||
let startTimestamp: number | null = null;
|
||||
let animationFrameId: number;
|
||||
const step = (timestamp: number) => {
|
||||
if (!startTimestamp) startTimestamp = timestamp;
|
||||
const progress = Math.min((timestamp - startTimestamp) / duration, 1);
|
||||
setCount(Math.floor(progress * end));
|
||||
if (progress < 1) {
|
||||
window.requestAnimationFrame(step);
|
||||
animationFrameId = window.requestAnimationFrame(step);
|
||||
}
|
||||
};
|
||||
window.requestAnimationFrame(step);
|
||||
animationFrameId = window.requestAnimationFrame(step);
|
||||
return () => window.cancelAnimationFrame(animationFrameId);
|
||||
}, [hasStarted, end, duration]);
|
||||
|
||||
return <span ref={countRef}>{count}</span>;
|
||||
|
||||
@ -15,8 +15,11 @@ const Counter: React.FC<CounterProps> = ({ end, duration = 2000 }) => {
|
||||
useEffect(() => {
|
||||
const observer = new IntersectionObserver(
|
||||
([entry]) => {
|
||||
if (entry.isIntersecting && !hasStarted) {
|
||||
if (entry.isIntersecting) {
|
||||
setHasStarted(true);
|
||||
} else {
|
||||
setHasStarted(false);
|
||||
setCount(0);
|
||||
}
|
||||
},
|
||||
{ threshold: 0.1 }
|
||||
@ -27,21 +30,23 @@ const Counter: React.FC<CounterProps> = ({ end, duration = 2000 }) => {
|
||||
}
|
||||
|
||||
return () => observer.disconnect();
|
||||
}, [hasStarted]);
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
if (!hasStarted) return;
|
||||
|
||||
let startTimestamp: number | null = null;
|
||||
let animationFrameId: number;
|
||||
const step = (timestamp: number) => {
|
||||
if (!startTimestamp) startTimestamp = timestamp;
|
||||
const progress = Math.min((timestamp - startTimestamp) / duration, 1);
|
||||
setCount(Math.floor(progress * end));
|
||||
if (progress < 1) {
|
||||
window.requestAnimationFrame(step);
|
||||
animationFrameId = window.requestAnimationFrame(step);
|
||||
}
|
||||
};
|
||||
window.requestAnimationFrame(step);
|
||||
animationFrameId = window.requestAnimationFrame(step);
|
||||
return () => window.cancelAnimationFrame(animationFrameId);
|
||||
}, [hasStarted, end, duration]);
|
||||
|
||||
return <span ref={countRef}>{count}</span>;
|
||||
|
||||
76
src/components/home/HomeServiceOne.tsx
Normal file
76
src/components/home/HomeServiceOne.tsx
Normal file
@ -0,0 +1,76 @@
|
||||
"use client";
|
||||
|
||||
import React from "react";
|
||||
import Link from "next/link";
|
||||
import { ourServices } from "@/utils/data";
|
||||
|
||||
const HomeServiceOne: React.FC = () => {
|
||||
return (
|
||||
<section className="service-one-home">
|
||||
<img src="https://bracketweb.com/pelocishtml/assets/images/shapes/home-services-shape-1.png" alt="pelocis" className="service-one-home__shape-one" />
|
||||
<img src="https://bracketweb.com/pelocishtml/assets/images/shapes/home-services-shape-2.png" alt="pelocis" className="service-one-home__shape-two" />
|
||||
<img src="https://bracketweb.com/pelocishtml/assets/images/shapes/home-services-shape-3.png" alt="pelocis" className="service-one-home__shape-three" />
|
||||
<div className="container">
|
||||
<div className="row align-items-center justify-content-between">
|
||||
<div className="col-lg-6">
|
||||
<div className="service-one-home__title">
|
||||
<div className="sec-title">
|
||||
<div className="sec-title__shape">
|
||||
</div>
|
||||
<h6 className="sec-title__tagline">OUR SERVICES</h6>
|
||||
<h3 className="sec-title__title">We Shape the Perfect
|
||||
Solution.</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-5">
|
||||
<div className="service-one-home__text">
|
||||
<p>
|
||||
At Metatroncube, we sculpt digital excellence, meticulously blending innovation with user-centric design to manifest your business vision. Partner with us to experience a seamless fusion of web & app development, SEO, digital marketing, and graphic design services. Our strategic solutions and unparalleled execution pave the way for your digital voyage. We are your navigators in the digital realm, steering your project from conception to completion with precision and creativity.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="swiper service-one-home__carousel mt-50">
|
||||
<div className="swiper-wrapper">
|
||||
{ourServices.slice(0, 6).map((service, index) => {
|
||||
return (
|
||||
<div key={index} className="swiper-slide">
|
||||
<div className="item">
|
||||
<div className="home-services__card">
|
||||
<div className="home-services__card__shape--one"></div>
|
||||
<div className="home-services__card__shape--two"></div>
|
||||
<div className="home-services__card__content">
|
||||
<div className="home-services__card__icon">
|
||||
<img src={service.icon} alt="icon" width="42" height="42" />
|
||||
</div>
|
||||
<h4 className="home-services__card__count">--</h4>
|
||||
<h2 className="home-services__card__title">
|
||||
<Link href={`/services-digital-solutions/${service.slug}`}>{service.title}</Link>
|
||||
</h2>
|
||||
<p className="home-services__card__text">
|
||||
{service.description.substring(0, 100)}...
|
||||
</p>
|
||||
</div>
|
||||
<div className="home-services__card__image">
|
||||
<img src={service.image} alt={service.title} />
|
||||
<div className="home-services__card__hover">
|
||||
<Link href={`/services-digital-solutions/${service.slug}`} className="home-services__card__hover-link">
|
||||
<i className="fa-solid fa-arrow-right"></i>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
|
||||
export default HomeServiceOne;
|
||||
@ -53,7 +53,7 @@ const AboutSection = () => {
|
||||
<img src="/assets/images/home/2/icon-1.webp" alt="img" />
|
||||
</div>
|
||||
<div className="content">
|
||||
<h5><a href="#">Exceptional Digital Quality</a></h5>
|
||||
<h5>Exceptional Digital Quality</h5>
|
||||
<p>High-quality graphics and precise web app development ensuring excellence.</p>
|
||||
</div>
|
||||
</div>
|
||||
@ -62,7 +62,7 @@ const AboutSection = () => {
|
||||
<img src="/assets/images/home/2/icon-2.webp" alt="img" />
|
||||
</div>
|
||||
<div className="content">
|
||||
<h5><a href="#">Expertise in innovation</a></h5>
|
||||
<h5>Expertise in innovation</h5>
|
||||
<p>Skilled developers leading in SEO, digital marketing, and technological advancements.</p>
|
||||
</div>
|
||||
</div>
|
||||
@ -71,7 +71,7 @@ const AboutSection = () => {
|
||||
<img src="/assets/images/home/2/icon-3.webp" alt="img" />
|
||||
</div>
|
||||
<div className="content">
|
||||
<h5><a href="#">Comprehensive web solutions</a></h5>
|
||||
<h5>Comprehensive web solutions</h5>
|
||||
<p>Robust web and mobile development with strategic SEO and marketing.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -56,10 +56,10 @@ const BannerSection = () => {
|
||||
</div>
|
||||
</div>
|
||||
<div className="banner-shape-area">
|
||||
<div
|
||||
{/* <div
|
||||
className="shape-1"
|
||||
style={{ backgroundImage: "url(/assets/images/home/1/white-blue/white.webp)" }}
|
||||
></div>
|
||||
></div> */}
|
||||
|
||||
<div
|
||||
className="shape-2"
|
||||
@ -71,10 +71,10 @@ const BannerSection = () => {
|
||||
style={{ backgroundImage: "url(/assets/images/home/1/dark-light/light.webp)" }}
|
||||
></div>
|
||||
|
||||
<div
|
||||
{/* <div
|
||||
className="shape-4"
|
||||
style={{ backgroundImage: "url(/assets/images/home/1/dark-light/dark.webp)" }}
|
||||
></div>
|
||||
></div> */}
|
||||
|
||||
<div
|
||||
className="shape-5"
|
||||
|
||||
@ -7,21 +7,30 @@ const ChooseSection = () => (
|
||||
<div className="small-container">
|
||||
<div className="row g-4">
|
||||
<div className="col-xxl-6 col-xl-6 col-lg-6 p-relative section-space-medium-bottom">
|
||||
<div className="sec-title-wrapper wow fadeInLeft" data-wow-delay=".5s">
|
||||
<div className="sec-title mt-25">
|
||||
<div className="sec-title__shape"></div>
|
||||
<h6 className="sec-title__tagline">WELCOME TO METATRONCUBE</h6>
|
||||
<div className="faq-one__title ">
|
||||
<div className="sec-title">
|
||||
<div className="sec-title__shape">
|
||||
</div>
|
||||
<h6 className="sec-title__tagline" style={{ color: "var(--pelocis-base, #e2a475)" }}>WELCOME TO METATRONCUBE</h6>
|
||||
<h3 className="sec-title__title text-white">Driving Client Success with Cutting-Edge Digital Solutions in Web & App Development, SEO, and Digital Marketing</h3>
|
||||
</div>
|
||||
{/* <img src="https://bracketweb.com/pelocishtml/assets/images/shapes/text-shape-2.png" alt="" className="sec-title__text-shape" /> */}
|
||||
</div>
|
||||
<div className="choose-content text-white wow fadeInRight" data-wow-delay=".7s">
|
||||
<p className="text-white">
|
||||
At Metatroncube Software Solutions, we're not just about web design and mobile app development; we're a hub of innovation in SEO, digital marketing, and graphic design services. Located in the Kitchener and Waterloo regions, our services stand out through a unique blend of innovative design and advanced technology.
|
||||
</p>
|
||||
<p className="text-white">
|
||||
Our expertise spans across AngularJS, ReactJS, HTML5, Node.js, PHP, and comprehensive frameworks for native Android, iOS, and Flutter. This is complemented by our strength in SEO strategies and digital marketing solutions, ensuring your brand not only looks good but also ranks high.
|
||||
</p>
|
||||
<p className="faq-one__text text-white">
|
||||
At Metatroncube Software Solutions, we're not just about web design and mobile app development; we're a hub of innovation in SEO, digital marketing, and graphic design services.
|
||||
</p>
|
||||
<div className="faq-one__card">
|
||||
<div className="faq-one__img">
|
||||
<img src="https://bracketweb.com/pelocishtml/assets/images/resources/faq-img-2.png" alt="pelocis" />
|
||||
</div>
|
||||
<div className="faq-one__content">
|
||||
<ul className="faq-one__list list-unstyled">
|
||||
<li className="text-white"><span className="fa fa-arrow-circle-right text-white"></span>Located in the Kitchener and Waterloo regions, our services stand out through a unique blend of innovative design and advanced technology.</li>
|
||||
<li className="text-white mt-4"><span className="fa fa-arrow-circle-right text-white"></span>Our expertise spans across AngularJS, ReactJS, HTML5, Node.js, PHP, and comprehensive frameworks for native Android, iOS, and Flutter.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div className="faq-one__quote text-white" style={{ backgroundColor: "rgba(255,255,255,0.1)" }}>
|
||||
This is complemented by our strength in SEO strategies and digital marketing solutions, ensuring your brand not only looks good but also ranks high.
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-xxl-6 col-xl-6 col-lg-6 wow fadeInLeft" data-wow-delay="1.2s">
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
import React from "react";
|
||||
|
||||
const CtaSection = () => (
|
||||
<section className="cta-1-section bg-color-1 p-relative wow fadeInDown mb-80" data-wow-delay=".5s">
|
||||
<section className="cta-1-section p-relative wow fadeInDown mb-80 mt-80" data-wow-delay=".5s">
|
||||
<div className="small-container">
|
||||
<div className="row g-0 box-shadow-1 fix">
|
||||
<div className="col-xxl-6 col-lg-6 bg-white">
|
||||
|
||||
@ -30,7 +30,7 @@ const TestimonialsSection = () => {
|
||||
: reviews;
|
||||
|
||||
const settings = {
|
||||
dots: true,
|
||||
dots: false,
|
||||
arrows: false,
|
||||
infinite: displayedReviews.length > 2,
|
||||
speed: 600,
|
||||
|
||||
@ -10,7 +10,7 @@ const Footer1 = () => (
|
||||
<div className="col-xxl-3 col-xl-3 col-lg-3 col-md-6">
|
||||
<div className="footer-widget-1">
|
||||
<figure className="image">
|
||||
<img src="/assets/img/logo.webp" alt="" />
|
||||
<img src="/assets/img-app/logo.webp" alt="footer logo" />
|
||||
</figure>
|
||||
<p className="mt-40 mb-40">Metatroncube Software Solutions: Where innovation meets execution to elevate your digital presence. Partner with us for bespoke web and app development that powers your business growth.</p>
|
||||
<div className="footer-socials">
|
||||
@ -64,12 +64,12 @@ const Footer1 = () => (
|
||||
<div className="footer-widget-2">
|
||||
<h4 className="mb-20 footer-title">Our Services</h4>
|
||||
<ul className="service-list">
|
||||
<li><Link href="/">Website Development</Link></li>
|
||||
<li><Link href="/">Mobile Application Development</Link></li>
|
||||
<li><Link href="/">Graphic Designing</Link></li>
|
||||
<li><Link href="/">UI / UX Designing</Link></li>
|
||||
<li><Link href="/">SEO & Content Writing</Link></li>
|
||||
<li><Link href="/">Digital Marketing</Link></li>
|
||||
<li><Link href="/services-digital-solutions/web-development">Website Development</Link></li>
|
||||
<li><Link href="/services-digital-solutions/mobile-application-development">Mobile Application Development</Link></li>
|
||||
<li><Link href="/services-digital-solutions/graphic-designing-company">Graphic Designing</Link></li>
|
||||
<li><Link href="/services-digital-solutions/ui-ux-designing">UI / UX Designing</Link></li>
|
||||
<li><Link href="/services-digital-solutions/search-engine-optimization-seo-content-writing">SEO & Content Writing</Link></li>
|
||||
<li><Link href="/services-digital-solutions/digital-marketing-agency-in-canada">Digital Marketing</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
@ -101,8 +101,8 @@ const Footer1 = () => (
|
||||
</span>
|
||||
</div>
|
||||
<div className="right-area">
|
||||
<span><Link href="#">Accessibility Statement</Link></span>
|
||||
<span><Link href="#">Privacy Policy</Link></span>
|
||||
<span><Link href="/accessibility-statement-for-metatroncube-software-solutions">Accessibility Statement</Link></span>
|
||||
<span><Link href="/privacy-policy">Privacy Policy</Link></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -31,34 +31,40 @@ const Header1 = () => {
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<header className="header-metatron-style">
|
||||
<div id="header-sticky" className={`header-area-metatron ${sticky ? "sticky" : ""}`}>
|
||||
<div className="container">
|
||||
<div className="header-row-wrapper align-items-center">
|
||||
<div className="header-logo-metatron">
|
||||
<Link href="/">
|
||||
<img src="/assets/img-app/logo.webp" alt="header logo" />
|
||||
</Link>
|
||||
</div>
|
||||
<div className="header-menu-metatron d-none d-lg-block">
|
||||
<nav id="mobile-menu" className="main-menu-metatron">
|
||||
<NavItemsMetatron />
|
||||
</nav>
|
||||
</div>
|
||||
<div className="header-action-metatron d-flex align-items-center">
|
||||
<div className="header-btn-metatron d-none d-lg-block">
|
||||
<Link className="metatron-primary-btn" href="/contact">
|
||||
Get Started Now <i className="fa-solid fa-angle-right ms-2"></i>
|
||||
<header className="header-metatron-style homepage1-body">
|
||||
<div id="header-sticky" className={`vl-header-area vl-transparent-header ${sticky ? "header-sticky" : ""}`}>
|
||||
<div className="container-fluid headerfix px-lg-5">
|
||||
<div className="row align-items-center row-bg3 px-lg-4">
|
||||
<div className="col-lg-2 col-md-6 col-6">
|
||||
<div className="vl-logo">
|
||||
<Link href="/">
|
||||
<img src="/assets/img-app/logo.webp" alt="header logo" style={{ width: '100%', maxWidth: '320px', height: 'auto', transition: 'all 0.3s' }} />
|
||||
</Link>
|
||||
</div>
|
||||
<div className="header-hamburger-metatron d-lg-none" onClick={toggleOffcanvas} style={{ zIndex: 1100 }}>
|
||||
<button className="hamburger-btn">
|
||||
{isOpen ? (
|
||||
<i className="fa-solid fa-xmark"></i>
|
||||
) : (
|
||||
<i className="fa-solid fa-bars-staggered"></i>
|
||||
)}
|
||||
</button>
|
||||
</div>
|
||||
<div className="col-lg-8 d-none d-lg-block">
|
||||
<div className="vl-main-menu text-center">
|
||||
<nav id="mobile-menu" className="vl-mobile-menu-active main-menu-metatron">
|
||||
<NavItemsMetatron />
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-2 col-md-6 col-6">
|
||||
<div className="header-action-metatron d-flex align-items-center justify-content-end">
|
||||
<div className="header-btn-metatron d-none d-lg-block">
|
||||
<Link className="vl-btn1" href="/contact" style={{ textDecoration: 'none', whiteSpace: 'nowrap' }}>
|
||||
Get Started Now <i className="fa-solid fa-angle-right ms-2"></i>
|
||||
</Link>
|
||||
</div>
|
||||
<div className="header-hamburger-metatron d-lg-none" onClick={toggleOffcanvas} style={{ zIndex: 1100 }}>
|
||||
<button className="hamburger-btn">
|
||||
{isOpen ? (
|
||||
<i className="fa-solid fa-xmark"></i>
|
||||
) : (
|
||||
<i className="fa-solid fa-bars-staggered"></i>
|
||||
)}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
104
src/components/privacy/PrivacyPolicyContent.tsx
Normal file
104
src/components/privacy/PrivacyPolicyContent.tsx
Normal file
@ -0,0 +1,104 @@
|
||||
import React from "react";
|
||||
|
||||
const PrivacyPolicyContent = () => {
|
||||
return (
|
||||
<section className="accessibility-section">
|
||||
<div className="small-container">
|
||||
<div className="row">
|
||||
<div className="col-12">
|
||||
<div className="accessibility-content">
|
||||
<h2>Privacy Policy</h2>
|
||||
|
||||
<h3>Introduction:</h3>
|
||||
<p>Welcome to Metatroncube Software Solutions! We are committed to protecting the privacy and security of your personal information. This Privacy Policy outlines our practices regarding the collection, use, and disclosure of your data when you use our services, and your privacy rights under applicable law.</p>
|
||||
|
||||
<h3>Scope and Consent:</h3>
|
||||
<p>By accessing or using our services, you acknowledge that you have read this Privacy Policy and understand your rights and responsibilities. You consent to the collection, use, and sharing of your information as described in this policy.</p>
|
||||
|
||||
<h3>Definitions:</h3>
|
||||
<ul>
|
||||
<li>"Services" refers to our website, software products, and related services.</li>
|
||||
<li>"Personal Data" is any information that can identify you as an individual.</li>
|
||||
<li>"Usage Data" is automatically collected data generated by the use of our services or from the service infrastructure itself (such as duration of a page visit).</li>
|
||||
</ul>
|
||||
|
||||
<h3>Information Collection and Use:</h3>
|
||||
<p>We collect several types of information for various purposes to provide and improve our service to you.</p>
|
||||
<p><strong>Types of Data Collected:</strong></p>
|
||||
|
||||
<p><strong>1. Personal Data</strong></p>
|
||||
<ul>
|
||||
<li>Email address</li>
|
||||
<li>First name and last name</li>
|
||||
<li>Phone number</li>
|
||||
<li>Other relevant information</li>
|
||||
</ul>
|
||||
|
||||
<p><strong>2. Usage Data</strong></p>
|
||||
<p>We may also collect information on how the Service is accessed and used. This Usage Data may include information such as your computer's Internet Protocol address (IP address), browser type, browser version, the pages of our Services that you visit, the time and date of your visit, the time spent on those pages, unique device identifiers, and other diagnostic data.</p>
|
||||
|
||||
<h3>Cookies and Tracking Data:</h3>
|
||||
<p>We use cookies and similar tracking technologies to monitor activity on our Services and store certain information. You can instruct your browser to refuse all cookies or indicate when a cookie is being sent.</p>
|
||||
|
||||
<h3>Use of Data:</h3>
|
||||
<p>Metatroncube Software Solutions uses the collected data for various purposes:</p>
|
||||
<ul>
|
||||
<li>Font adjustments users can increase and decrease its size, change its family (type), adjust the spacing, alignment, line height, and more.</li>
|
||||
<li>To provide and maintain our Services</li>
|
||||
<li>To notify you about changes to our Services</li>
|
||||
<li>To allow you to participate in interactive features of our Services when you choose to do so</li>
|
||||
<li>To provide customer support</li>
|
||||
<li>To gather analysis or valuable information so that we can improve our Services</li>
|
||||
<li>To monitor the usage of our Services</li>
|
||||
<li>To detect, prevent, and address technical issues</li>
|
||||
</ul>
|
||||
|
||||
<h3>Legal Basis for Processing Personal Data:</h3>
|
||||
<p>We process your personal data in accordance with the law, such as:</p>
|
||||
|
||||
<h3>Notes, comments, and feedback</h3>
|
||||
<ul className="mb-20">
|
||||
|
||||
<li>Your consent</li>
|
||||
<li>The need to perform a contract with you</li>
|
||||
<li>The need to comply with legal obligations</li>
|
||||
<li>Our legitimate business interests, such as improving our Services</li>
|
||||
</ul>
|
||||
|
||||
<h3>Retention of Data:</h3>
|
||||
<p>We will retain your Personal Data only for as long as is necessary for the purposes set out in this Privacy Policy.</p>
|
||||
<h3>Transfer of Data:</h3>
|
||||
<p>Your information, including Personal Data, may be transferred to — and maintained on — computers located outside of your jurisdiction where the data protection laws may differ from those of your jurisdiction.</p>
|
||||
|
||||
<h3>Disclosure of Data:</h3>
|
||||
<p>We may disclose personal information in good faith when such action is necessary for the following:</p>
|
||||
<ul>
|
||||
<li>To comply with a legal obligation</li>
|
||||
<li>To protect and defend the rights or property of Metatroncube Software Solutions</li>
|
||||
<li>To prevent or investigate possible wrongdoing in connection with the Services</li>
|
||||
<li>To protect the personal safety of users of the Services or the public</li>
|
||||
<li>To protect against legal liability</li>
|
||||
</ul>
|
||||
|
||||
<h3>Security of Data:</h3>
|
||||
<p>The security of your data is important to us, but no method of transmission over the Internet or method of electronic storage is 100% secure. We strive to use commercially acceptable means to protect your Personal Data.</p>
|
||||
|
||||
<h3>Children's Privacy:</h3>
|
||||
<p>Our Service does not address anyone under the age of 18 ("Children").</p>
|
||||
|
||||
<h3>Changes to This Privacy Policy:</h3>
|
||||
<p>We may update our Privacy Policy from time to time. We will notify you of any changes by posting the new Privacy Policy on this page.</p>
|
||||
|
||||
|
||||
<h3>Contact Us</h3>
|
||||
<p>If you have any questions about this Privacy Policy, please contact us:</p>
|
||||
<p>By email: <a href="mailto:info@metatroncubesolutions.com">info@metatroncubesolutions.com</a></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
|
||||
export default PrivacyPolicyContent;
|
||||
@ -9202,7 +9202,8 @@ only screen and (min-width: 768px) and (max-width: 991px),
|
||||
/*============= HEADER CSS AREA ENDS ===============*/
|
||||
.homepage1-body .row-bg3 {
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
/* background: rgba(255, 255, 255, 0.1); */
|
||||
background: linear-gradient(90deg, #1a1f2b 0%, #3779b9 60%, #1a1f2b 100%);
|
||||
backdrop-filter: blur(1px);
|
||||
padding: 20px 20px;
|
||||
border-radius: 16px;
|
||||
@ -9253,6 +9254,7 @@ only screen and (min-width: 768px) and (max-width: 991px),
|
||||
|
||||
.homepage1-body .vl-main-menu ul {
|
||||
text-align: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.homepage1-body .vl-main-menu ul>li {
|
||||
|
||||
@ -10266,6 +10266,208 @@ info@metatroncubesolutions.com
|
||||
"answer": "Yes, especially in local searches. A small business with thoughtful modern business website features, honest content, and strong local signals can absolutely show up well for Waterloo searches. You don't have to look like a huge corporation; you just have to be clear, fast, and trustworthy."
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": 51,
|
||||
"hTittle": "Why Social Media Management Is Important for Your Business",
|
||||
"title": "Why Social Media Management Is Important for Your Business",
|
||||
"image": "/assets/images/blog/blog-cards/feb-27-card.webp",
|
||||
"big_image": "/assets/images/blog/blog-details/feb-27-big-img.webp",
|
||||
"date": "FEBRUARY 27, 2026",
|
||||
"user": "Admin",
|
||||
"category": "Digital Marketing",
|
||||
"slug": "why-social-media-management-important-business",
|
||||
"seoDesc": "Discover why social media management matters for business growth. Learn how Metatron Cube Solutions boosts your brand visibility, engagement, and revenue online.",
|
||||
"metatitle": "Why Social Media Management Is Important for Your Business | Metatron Cube Solutions",
|
||||
"metaDisc": "Discover why social media management matters for business growth. Learn how Metatron Cube Solutions boosts your brand visibility, engagement, and revenue online.",
|
||||
"description": `
|
||||
<h4 class="mb-3">Why Social Media Management Is Important for Your Business</h4>
|
||||
<p>In today's digital world, social media is no longer optional — it's essential. Whether you're a small local startup or an established enterprise, effective social media management can make or break your brand's online success.</p>
|
||||
<p>Social platforms like Facebook, Instagram, LinkedIn, and YouTube aren't just places to share updates — they have become core channels for building visibility, engaging customers, and driving revenue. But managing social media well requires strategy, consistency, creativity, and insight — which is where professional social media management comes in.</p>
|
||||
<p>Let's explore why social media management is important for your business and how it fuels growth in measurable ways.</p>
|
||||
|
||||
<h4>1. Social Media Builds Brand Awareness</h4>
|
||||
<p>Today's customers discover brands online long before they walk through your doors or visit your website.</p>
|
||||
<p>When your business maintains consistent, relevant, and engaging social media content:</p>
|
||||
<ul class="ml-4 mb-4">
|
||||
<li>More people see your brand</li>
|
||||
<li>You become memorable</li>
|
||||
<li>You develop recognition and trust</li>
|
||||
</ul>
|
||||
<p>Without strategic posting and community engagement, your business risks being invisible to your audience — even if you offer a superior product or service.</p>
|
||||
|
||||
<h4>2. It Helps You Reach the Right Audience</h4>
|
||||
<p>Organic reach alone has declined over the years, especially on platforms like Facebook and Instagram. That's why social media management includes targeted strategies:</p>
|
||||
<ul class="ml-4 mb-4">
|
||||
<li>Audience research</li>
|
||||
<li>Paid promotions</li>
|
||||
<li>Tailored content for platform demographics</li>
|
||||
</ul>
|
||||
<p>A proper social media strategy ensures your content reaches people who are most likely to care — reducing waste and increasing engagement.</p>
|
||||
|
||||
<h4>3. Social Media Boosts Engagement and Loyalty</h4>
|
||||
<p>Posting content isn't enough — interaction matters.</p>
|
||||
<p>Social media management focuses on:</p>
|
||||
<ul class="ml-4 mb-4">
|
||||
<li>Replying to comments</li>
|
||||
<li>Answering DMs</li>
|
||||
<li>Engaging with followers</li>
|
||||
<li>Participating in relevant conversations</li>
|
||||
</ul>
|
||||
<p>These actions humanize your brand. When customers feel heard and appreciated, loyalty grows. That loyalty often turns into repeat purchases, referrals, and long-term customer relationships.</p>
|
||||
|
||||
<h4>4. Drive Website Traffic & Lead Generation</h4>
|
||||
<p>Social media isn't just about likes — it drives measurable business results.</p>
|
||||
<p>Well-executed strategies create:</p>
|
||||
<ul class="ml-4 mb-4">
|
||||
<li>Visits to your website</li>
|
||||
<li>Clicks to product pages</li>
|
||||
<li>Email list sign-ups</li>
|
||||
<li>Leads from gated content or offers</li>
|
||||
</ul>
|
||||
<p>Brands that align social content with specific business goals see stronger conversions than those treating social media like a placeable bulletin board.</p>
|
||||
|
||||
<h4>5. You Get Real-Time Customer Insights</h4>
|
||||
<p>One of the best benefits of social media management is access to instant feedback. Through analytics and engagement data, you can uncover:</p>
|
||||
<ul class="ml-4 mb-4">
|
||||
<li>What content resonates</li>
|
||||
<li>When your audience is most active</li>
|
||||
<li>What products or topics spark interest</li>
|
||||
<li>What needs improvement</li>
|
||||
</ul>
|
||||
<p>These insights not only improve your social strategies, but they also inform other areas of your business like product design, customer support, and email marketing.</p>
|
||||
|
||||
<h4>6. Better Reputation Management</h4>
|
||||
<p>In a time when online reviews and comments influence buying decisions, social media management helps you:</p>
|
||||
<ul class="ml-4 mb-4">
|
||||
<li>Monitor brand mentions</li>
|
||||
<li>Address negative feedback professionally</li>
|
||||
<li>Highlight positive customer experiences</li>
|
||||
<li>Build credibility and trust</li>
|
||||
</ul>
|
||||
<p>Ignoring social mentions or feedback can harm your reputation — but proactively managing them strengthens your brand image.</p>
|
||||
|
||||
<h4>7. Outperform Competitors</h4>
|
||||
<p>If your competitors are active and consistent on social media while you're not, they have an advantage. A professional social media manager:</p>
|
||||
<ul class="ml-4 mb-4">
|
||||
<li>Keeps you consistent</li>
|
||||
<li>Makes your brand stand out</li>
|
||||
<li>Ensures your content aligns with trends and audience needs</li>
|
||||
<li>Helps you stay relevant</li>
|
||||
</ul>
|
||||
<p>In many industries, social media is now a competitive battlefield. Being passive means falling behind.</p>
|
||||
|
||||
<h4>Conclusion – Social Media Is No Longer Optional</h4>
|
||||
<p>Social media is much more than posting pretty pictures or occasional updates. It's a business engine — one that builds awareness, engages audiences, drives leads, and fuels revenue growth.</p>
|
||||
<p>With professional social media management, your brand gains clarity, consistency, and a strategy tailored to real business outcomes.</p>
|
||||
<p>At Metatron Cube Solutions, we help businesses leverage social platforms with purpose — turning followers into customers and profiles into profit.</p>
|
||||
`,
|
||||
},
|
||||
{
|
||||
"id": 52,
|
||||
"hTittle": "Why You Need a Digital Marketing Agency for Business Growth",
|
||||
"title": "Why You Need a Digital Marketing Agency for Business Growth",
|
||||
"image": "/assets/images/blog/blog-cards/feb-28-card.webp",
|
||||
"big_image": "/assets/images/blog/blog-details/feb-28-big-img.webp",
|
||||
"date": "FEBRUARY 28, 2026",
|
||||
"user": "Admin",
|
||||
"category": "Digital Marketing",
|
||||
"slug": "why-you-need-digital-marketing-agency-business-growth",
|
||||
"seoDesc": "Learn why businesses need a digital marketing agency. Metatron Cube Solutions drives targeted traffic, boosts conversions, and grows your brand with proven strategies.",
|
||||
"metatitle": "Why You Need a Digital Marketing Agency | Metatron Cube Solutions",
|
||||
"metaDisc": "Learn why businesses need a digital marketing agency. Metatron Cube Solutions drives targeted traffic, boosts conversions, and grows your brand with proven strategies.",
|
||||
"description": `
|
||||
<h4 class="mb-3">Why You Need a Digital Marketing Agency for Business Growth</h4>
|
||||
<p>Every business owner wants growth — but the path to sustainable expansion isn't always clear. From SEO and social ads to content and analytics, modern marketing requires diverse skills and tools.</p>
|
||||
<p>That's where a digital marketing agency becomes invaluable.</p>
|
||||
<p>Digital marketing isn't just about posting ads — it's about connecting your brand with the right audience at the right time, on the right platforms, with the right message.</p>
|
||||
<p>Here's why partnering with a digital marketing agency is not just helpful — it's essential for business success.</p>
|
||||
|
||||
<h4>1. Expertise You Can Rely On</h4>
|
||||
<p>Digital marketing is complex. It involves:</p>
|
||||
<ul class="ml-4 mb-4">
|
||||
<li>Search engine optimization (SEO)</li>
|
||||
<li>Pay-Per-Click (PPC) advertising</li>
|
||||
<li>Social media advertising</li>
|
||||
<li>Content marketing</li>
|
||||
<li>Email automation</li>
|
||||
<li>Analytics and reporting</li>
|
||||
</ul>
|
||||
<p>Trying to master all these disciplines internally can be expensive, inconsistent, and inefficient. A digital marketing agency brings experts in each area — ensuring your strategies are executed with precision and experience.</p>
|
||||
|
||||
<h4>2. Cost-Effective Growth</h4>
|
||||
<p>Hiring an internal marketing team can be costly — salaries, tools, training, and overhead add up quickly.</p>
|
||||
<p>In contrast, a digital marketing agency:</p>
|
||||
<ul class="ml-4 mb-4">
|
||||
<li>Saves on recruitment expenses</li>
|
||||
<li>Provides access to premium tools</li>
|
||||
<li>Offers scalable engagement plans</li>
|
||||
<li>Delivers measurable ROI</li>
|
||||
</ul>
|
||||
<p>You get a full marketing department at a fraction of the cost.</p>
|
||||
|
||||
<h4>3. Objective Strategic Guidance</h4>
|
||||
<p>Internal teams may be emotionally invested in existing products, prices, or approaches. An agency provides:</p>
|
||||
<ul class="ml-4 mb-4">
|
||||
<li>Unbiased performance insights</li>
|
||||
<li>Strategy adjustments based on data</li>
|
||||
<li>Honest optimization recommendations</li>
|
||||
</ul>
|
||||
<p>This objectivity ensures your marketing dollars are spent where it matters most.</p>
|
||||
|
||||
<h4>4. Stay Ahead in a Fast-Changing Digital Landscape</h4>
|
||||
<p>The digital space evolves rapidly. Platforms change algorithms, new tools launch monthly, and consumer trends shift constantly.</p>
|
||||
<p>A dedicated digital marketing agency:</p>
|
||||
<ul class="ml-4 mb-4">
|
||||
<li>Tracks industry updates</li>
|
||||
<li>Tests emerging formats</li>
|
||||
<li>Adapts campaigns quickly</li>
|
||||
<li>Keeps your brand relevant</li>
|
||||
</ul>
|
||||
<p>This proactive approach is difficult without specialized focus.</p>
|
||||
|
||||
<h4>5. Better Lead Quality & Targeting</h4>
|
||||
<p>Marketing isn't just about visibility — it's about attracting the right audience.</p>
|
||||
<p>An agency doesn't just increase traffic — it increases qualified, interested, and ready-to-convert traffic.</p>
|
||||
<p>Through strategic audience targeting, retargeting, and data-driven funnel optimization, you get:</p>
|
||||
<ul class="ml-4 mb-4">
|
||||
<li>Higher conversions</li>
|
||||
<li>Lower acquisition costs</li>
|
||||
<li>Stronger customer retention</li>
|
||||
</ul>
|
||||
|
||||
<h4>6. Faster Results with Performance Tracking</h4>
|
||||
<p>One of the biggest advantages of working with a digital marketing agency is measurable results.</p>
|
||||
<p>With tools like Google Analytics, heat mapping, campaign dashboards, and conversion tracking, you can:</p>
|
||||
<ul class="ml-4 mb-4">
|
||||
<li>See what's working</li>
|
||||
<li>Identify opportunities for improvement</li>
|
||||
<li>Adjust campaigns in real time</li>
|
||||
<li>Forecast future growth</li>
|
||||
</ul>
|
||||
<p>This level of insight fuels smarter strategy — not guesswork.</p>
|
||||
|
||||
<h4>7. Focus on What You Do Best</h4>
|
||||
<p>As a business owner, your energy should go toward:</p>
|
||||
<ul class="ml-4 mb-4">
|
||||
<li>Product development</li>
|
||||
<li>Customer experience</li>
|
||||
<li>Operations and growth</li>
|
||||
</ul>
|
||||
<p>Instead of managing campaigns, testing audiences, or debating SEO tactics, a digital marketing agency lets you focus on your core strengths while they handle your growth engine.</p>
|
||||
|
||||
<h4>Conclusion – A Digital Marketing Agency Is More Than a Service — It's a Growth Partner</h4>
|
||||
<p>In today's competitive online marketplace, effective marketing requires strategy, expertise, creativity, and consistent execution.</p>
|
||||
<p>A digital marketing agency like Metatron Cube Solutions brings all of these together:</p>
|
||||
<ul class="ml-4 mb-4">
|
||||
<li>Expert strategies</li>
|
||||
<li>Measurable performance</li>
|
||||
<li>Scalable growth</li>
|
||||
<li>Hassle-free execution</li>
|
||||
</ul>
|
||||
<p>Whether you want more traffic, leads, sales, or brand authority, partnering with the right agency transforms marketing from a cost center into a growth engine.</p>
|
||||
<p>If you're ready to scale your business and dominate your digital space, professional digital marketing support isn't optional — it's essential.</p>
|
||||
`,
|
||||
}
|
||||
]
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user