seo component gatsby- effecting layout

0 votes

-1

having this very bizarre problem with my gatsby project where the SEO component (quite similar to the default on suggested in docs) is effecting my page layout. no matter where i put the SEO component (inside or outside the layout wrapper component my navbar seems to be effected... very strange because the seo component from what i can see has no stylings or jsx or css or anything. its just a way to add meta tags for SEO.. can someone help? here is my page layout (using basic react context and seo compoennt here to inject meta deatail)

<NavActive.Provider value={active}>
  <SEO image={logo} />
   <Layout active={active} setActive={setActive}>
    <div className={`${active&&'body-active'}`}>
      <Banner />
      <Column />
      <Paragraph text={text} header/>
      <Blackbar /> 
      <Paragraph text={text} />
      <Blackbar button />
      <Split />
      <div className='c'>
      <Blackbar />
      </div>
    </div>
  </Layout>
</NavActive.Provider>

and then here is the way my seo compoennts is structured. have NO idea what could be causing this!

/**
 * SEO component that queries for data with
 *  Gatsby's useStaticQuery React hook
 *
 * See: https://www.gatsbyjs.org/docs/use-static-query/
 */

import React from "react"
import PropTypes from "prop-types"
import { Helmet } from "react-helmet"
import { useLocation } from "@reach/router"
import { useStaticQuery, graphql } from "gatsby"

function SEO({ description, lang, meta, image, title }) {
  const { pathname } = useLocation()

  const { site } = useStaticQuery(
    graphql`
      query {
        site {
          siteMetadata {
            title
            description
            author
            image
            url
          }
        }
      }
    `
  )

  const seo = {
    title: title || "Orcawise - Start a willing conversation",
Feb 19, 2022 in Others by Kichu
• 19,040 points
397 views

1 answer to this question.

0 votes
    <link
      rel="stylesheet"
      href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"
      integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm"
      crossorigin="anonymous"
    />
this is your source code try commenting to check if it effects the layout
answered Feb 20, 2022 by narikkadan
• 63,600 points

Related Questions In Others

+2 votes
2 answers

Is Reactjs SEO friendly? with google bots

Yes, with SERVER-SIDE RENDERING you will not face ...READ MORE

answered Feb 10, 2022 in Others by Shreesh
• 160 points
2,877 views
0 votes
1 answer

How to echo WP SEO Yoast synonyms in PHP?

 the meta_key in wp_postmeta table is _yoast_wpseo_keyword ...READ MORE

answered Feb 10, 2022 in Others by narikkadan
• 63,600 points
1,145 views
0 votes
1 answer

Enabling SEO Optimizer in Magento 1.7 returns 404 error page on frontend links

Modified Magento's stock .htaccess to fit my ...READ MORE

answered Feb 10, 2022 in Others by narikkadan
• 63,600 points
624 views
0 votes
1 answer

What are canonical URLs and how do they affect your SEO?

canonical URLs are distinct URL used to ...READ MORE

answered Feb 11, 2022 in Others by narikkadan
• 63,600 points
484 views
0 votes
1 answer

Issue with Open Graph tags and Nuxt.js (prod?)

I also faced the same issue. The ...READ MORE

answered Mar 11, 2022 in Digital Marketing by narikkadan
• 63,600 points
2,164 views
0 votes
1 answer

How to get Stack Overflow SEO friendly URL structure in Nuxt.js?

The following worked for me : To get ...READ MORE

answered Mar 11, 2022 in Digital Marketing by narikkadan
• 63,600 points
1,810 views
0 votes
0 answers
0 votes
1 answer

Adding public contact from request to aws

Third one seems to be the best ...READ MORE

answered Jun 28, 2018 in DevOps on Cloud by DareDev
• 6,890 points
739 views
0 votes
1 answer

Problem with yoast SEO

This is (probably) not a problem of ...READ MORE

answered Feb 10, 2022 in Others by narikkadan
• 63,600 points
471 views
0 votes
1 answer

how to show the <meta> values of yoast seo with some function?

check this folder : wordpress-seo\src\presenters\open-graph you can ...READ MORE

answered Feb 10, 2022 in Others by narikkadan
• 63,600 points
621 views
webinar REGISTER FOR FREE WEBINAR X
REGISTER NOW
webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP