Home page hero banner language updated
This commit is contained in:
Alaguraj0361
parent
e22446e764
commit
1494e376c2
@ -1,6 +1,9 @@
|
||||
'use client'; // If this component is client-side only
|
||||
|
||||
import React from "react";
|
||||
import Slider from "react-slick";
|
||||
import Link from 'next/link'
|
||||
import Link from 'next/link';
|
||||
import { useTranslation } from 'next-i18next';
|
||||
import "slick-carousel/slick/slick.css";
|
||||
import "slick-carousel/slick/slick-theme.css";
|
||||
|
||||
@ -16,24 +19,26 @@ const settings = {
|
||||
};
|
||||
|
||||
const Hero = () => {
|
||||
const { t } = useTranslation('homeHero'); // Use 'home' namespace
|
||||
|
||||
return (
|
||||
<section className="wpo-hero-slider">
|
||||
<div className="hero-container">
|
||||
<div className="hero-wrapper">
|
||||
<Slider {...settings}>
|
||||
<div className="hero-slide">
|
||||
<div className="slide-inner slide-bg-image" style={{ backgroundImage: `url(${'images/home/banner/banner-1.webp'})` }}>
|
||||
<div className="slide-inner slide-bg-image" style={{ backgroundImage: `url(/images/home/banner/banner-1.webp)` }}>
|
||||
<div className="container-fluid">
|
||||
<div className="slide-content">
|
||||
<div data-swiper-parallax="300" className="slide-title">
|
||||
<h2>Family Immigration Assistance</h2>
|
||||
<h2>{t('hero.slide1.title')}</h2>
|
||||
</div>
|
||||
<div data-swiper-parallax="400" className="slide-text">
|
||||
<p>Reuniting loved ones, one case at a time.</p>
|
||||
<p>{t('hero.slide1.text')}</p>
|
||||
</div>
|
||||
<div className="clearfix"></div>
|
||||
<div className="slide-btns">
|
||||
<Link href="/about" className="theme-btn">About</Link>
|
||||
<Link href="/about" className="theme-btn">{t('hero.slide1.button')}</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -41,54 +46,56 @@ const Hero = () => {
|
||||
</div>
|
||||
|
||||
<div className="hero-slide">
|
||||
<div className="slide-inner slide-bg-image" style={{ backgroundImage: `url(${'images/home/banner/banner-2.webp'})` }}>
|
||||
<div className="slide-inner slide-bg-image" style={{ backgroundImage: `url(/images/home/banner/banner-2.webp)` }}>
|
||||
<div className="container-fluid">
|
||||
<div className="slide-content">
|
||||
<div data-swiper-parallax="300" className="slide-title">
|
||||
<h2>Employment & Work Visa Solutions</h2>
|
||||
<h2>{t('hero.slide2.title')}</h2>
|
||||
</div>
|
||||
<div data-swiper-parallax="400" className="slide-text">
|
||||
<p>Your career deserves a global gateway.</p>
|
||||
<p>{t('hero.slide2.text')}</p>
|
||||
</div>
|
||||
<div className="clearfix"></div>
|
||||
<div className="slide-btns">
|
||||
<Link href="/our-approach" className="theme-btn">Our Approach</Link>
|
||||
<Link href="/our-approach" className="theme-btn">{t('hero.slide2.button')}</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="hero-slide">
|
||||
<div className="slide-inner slide-bg-image" style={{ backgroundImage: `url(${'images/home/banner/banner-3.webp'})` }}>
|
||||
<div className="slide-inner slide-bg-image" style={{ backgroundImage: `url(/images/home/banner/banner-3.webp)` }}>
|
||||
<div className="container-fluid">
|
||||
<div className="slide-content">
|
||||
<div data-swiper-parallax="300" className="slide-title">
|
||||
<h2>Investor & Business Immigration</h2>
|
||||
<h2>{t('hero.slide3.title')}</h2>
|
||||
</div>
|
||||
<div data-swiper-parallax="400" className="slide-text">
|
||||
<p>Building futures through business opportunities.</p>
|
||||
<p>{t('hero.slide3.text')}</p>
|
||||
</div>
|
||||
<div className="clearfix"></div>
|
||||
<div className="slide-btns">
|
||||
<Link href="/services" className="theme-btn">Services</Link>
|
||||
<Link href="/services" className="theme-btn">{t('hero.slide3.button')}</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="hero-slide">
|
||||
<div className="slide-inner slide-bg-image" style={{ backgroundImage: `url(${'images/home/banner/banner-4.webp'})` }}>
|
||||
<div className="slide-inner slide-bg-image" style={{ backgroundImage: `url(/images/home/banner/banner-4.webp)` }}>
|
||||
<div className="container-fluid">
|
||||
<div className="slide-content">
|
||||
<div data-swiper-parallax="300" className="slide-title">
|
||||
<h2>Deportation Defense & Legal Representation</h2>
|
||||
<h2>{t('hero.slide4.title')}</h2>
|
||||
</div>
|
||||
<div data-swiper-parallax="400" className="slide-text">
|
||||
<p>Fighting for your right to stay.</p>
|
||||
<p>{t('hero.slide4.text')}</p>
|
||||
</div>
|
||||
<div className="clearfix"></div>
|
||||
<div className="slide-btns">
|
||||
<Link href="/contact" className="theme-btn">Contact</Link>
|
||||
<Link href="/contact" className="theme-btn">{t('hero.slide4.button')}</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -103,7 +110,7 @@ const Hero = () => {
|
||||
</svg>
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
);
|
||||
};
|
||||
|
||||
export default Hero;
|
||||
export default Hero;
|
||||
|
||||
@ -4,7 +4,19 @@ module.exports = {
|
||||
locales: ['en', 'es'],
|
||||
localeDetection: false,
|
||||
},
|
||||
ns: ['common', 'menu'],
|
||||
ns: ['common', 'menu', 'homeHero'],
|
||||
defaultNS: 'common',
|
||||
// localePath: './public/locales',
|
||||
};
|
||||
|
||||
// aakash
|
||||
|
||||
|
||||
// Selvi
|
||||
|
||||
|
||||
// Vidhya
|
||||
|
||||
|
||||
// Alagu Raj
|
||||
|
||||
|
||||
@ -21,6 +21,7 @@ import TestimonialSection from '../../components/aboutPage/TestimonialSection';
|
||||
import TestimonialSection2 from '../../components/aboutPage/TestimonialSection2';
|
||||
import bg from '/public/images/about/about-banner.webp'
|
||||
|
||||
import { serverSideTranslations } from 'next-i18next/serverSideTranslations';
|
||||
const AboutPage = () => {
|
||||
return (
|
||||
<Fragment>
|
||||
@ -42,3 +43,13 @@ const AboutPage = () => {
|
||||
)
|
||||
};
|
||||
export default AboutPage;
|
||||
|
||||
// ✅ This enables translations (menu, and more if you add other namespaces)
|
||||
export async function getStaticProps({ locale }) {
|
||||
return {
|
||||
props: {
|
||||
...(await serverSideTranslations(locale, ['common', 'menu'])), // Add 'home', 'footer', etc. if needed
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
@ -5,6 +5,7 @@ import Contactpage from '../../components/Contactpage/Contactpage'
|
||||
import Scrollbar from '../../components/scrollbar/scrollbar'
|
||||
import Footer from '../../components/footer/Footer';
|
||||
import contact from '/public/images/contact/contact-banner.webp';
|
||||
import { serverSideTranslations } from 'next-i18next/serverSideTranslations';
|
||||
|
||||
const ContactPage =() => {
|
||||
return(
|
||||
@ -19,3 +20,12 @@ const ContactPage =() => {
|
||||
};
|
||||
export default ContactPage;
|
||||
|
||||
// ✅ This enables translations (menu, and more if you add other namespaces)
|
||||
export async function getStaticProps({ locale }) {
|
||||
return {
|
||||
props: {
|
||||
...(await serverSideTranslations(locale, ['common', 'menu'])), // Add 'home', 'footer', etc. if needed
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
@ -16,31 +16,31 @@ import introImg from '/public/images/home/expert-immigration-guidance.webp';
|
||||
import { serverSideTranslations } from 'next-i18next/serverSideTranslations';
|
||||
|
||||
const HomePage = () => {
|
||||
return (
|
||||
<Fragment>
|
||||
<Navbar hclass={'wpo-site-header-s1'} topbarNone={'topbar-none'} Logo={'/images/logo.svg'} />
|
||||
<Hero />
|
||||
<Features sClass={'wpo-service-section-s2'} />
|
||||
<About introImg={introImg} abClass={'wpo-about-section-s2'} />
|
||||
<ServiceSection />
|
||||
<FunFact fnTpClass={'funfact-wrap-sec'} fnClass={'wpo-fun-fact-section-s3'} />
|
||||
<ServiceSectionS2 />
|
||||
<Testimonial />
|
||||
<Donors />
|
||||
<BlogSection />
|
||||
<Footer />
|
||||
<Scrollbar />
|
||||
</Fragment>
|
||||
);
|
||||
return (
|
||||
<Fragment>
|
||||
<Navbar hclass={'wpo-site-header-s1'} topbarNone={'topbar-none'} Logo={'/images/logo.svg'} />
|
||||
<Hero />
|
||||
<Features sClass={'wpo-service-section-s2'} />
|
||||
<About introImg={introImg} abClass={'wpo-about-section-s2'} />
|
||||
<ServiceSection />
|
||||
<FunFact fnTpClass={'funfact-wrap-sec'} fnClass={'wpo-fun-fact-section-s3'} />
|
||||
<ServiceSectionS2 />
|
||||
<Testimonial />
|
||||
<Donors />
|
||||
<BlogSection />
|
||||
<Footer />
|
||||
<Scrollbar />
|
||||
</Fragment>
|
||||
);
|
||||
};
|
||||
|
||||
export default HomePage;
|
||||
|
||||
// ✅ This enables translations (menu, and more if you add other namespaces)
|
||||
export async function getStaticProps({ locale }) {
|
||||
return {
|
||||
props: {
|
||||
...(await serverSideTranslations(locale, ['common','menu'])), // Add 'home', 'footer', etc. if needed
|
||||
},
|
||||
};
|
||||
return {
|
||||
props: {
|
||||
...(await serverSideTranslations(locale, ['common', 'menu', 'homeHero'])), // Add 'home', 'footer', etc. if needed
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
24
public/locales/en/homeHero.json
Normal file
24
public/locales/en/homeHero.json
Normal file
@ -0,0 +1,24 @@
|
||||
{
|
||||
"hero": {
|
||||
"slide1": {
|
||||
"title": "Family Immigration Assistance",
|
||||
"text": "Reuniting loved ones, one case at a time.",
|
||||
"button": "About"
|
||||
},
|
||||
"slide2": {
|
||||
"title": "Employment & Work Visa Solutions",
|
||||
"text": "Your career deserves a global gateway.",
|
||||
"button": "Our Approach"
|
||||
},
|
||||
"slide3": {
|
||||
"title": "Investor & Business Immigration",
|
||||
"text": "Building futures through business opportunities.",
|
||||
"button": "Services"
|
||||
},
|
||||
"slide4": {
|
||||
"title": "Deportation Defense & Legal Representation",
|
||||
"text": "Fighting for your right to stay.",
|
||||
"button": "Contact"
|
||||
}
|
||||
}
|
||||
}
|
||||
24
public/locales/es/homeHero.json
Normal file
24
public/locales/es/homeHero.json
Normal file
@ -0,0 +1,24 @@
|
||||
{
|
||||
"hero": {
|
||||
"slide1": {
|
||||
"title": "Asistencia de Inmigración Familiar",
|
||||
"text": "Reuniendo a seres queridos, un caso a la vez.",
|
||||
"button": "Acerca de"
|
||||
},
|
||||
"slide2": {
|
||||
"title": "Soluciones de Visa de Trabajo y Empleo",
|
||||
"text": "Tu carrera merece una puerta al mundo.",
|
||||
"button": "Nuestro Enfoque"
|
||||
},
|
||||
"slide3": {
|
||||
"title": "Inmigración para Inversores y Negocios",
|
||||
"text": "Construyendo futuros a través de oportunidades empresariales.",
|
||||
"button": "Servicios"
|
||||
},
|
||||
"slide4": {
|
||||
"title": "Defensa Contra Deportación y Representación Legal",
|
||||
"text": "Luchando por tu derecho a permanecer.",
|
||||
"button": "Contacto"
|
||||
}
|
||||
}
|
||||
}
|
||||
Loading…
x
Reference in New Issue
Block a user