index.tsx 2.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115
  1. import Head from "next/head";
  2. import { ReactNode } from "react";
  3. export interface SeoHeadConfig {
  4. title?: string;
  5. description?: string;
  6. keywords?: string;
  7. url?: string;
  8. siteName?: string;
  9. img?: string;
  10. canonical?: string;
  11. pre?: string;
  12. next?: string;
  13. jsonLd?: string;
  14. }
  15. interface SeoHeadProps {
  16. seoConfig: SeoHeadConfig;
  17. children?: ReactNode;
  18. }
  19. export function SeoHead({ seoConfig, children }: SeoHeadProps) {
  20. return (
  21. <Head>
  22. {seoConfig.title ? <title>{seoConfig.title}</title> : null}
  23. {seoConfig.description ? (
  24. <meta name="description" content={seoConfig.description} />
  25. ) : null}
  26. {seoConfig.keywords ? (
  27. <meta name="keywords" content={seoConfig.keywords} />
  28. ) : null}
  29. {seoConfig.url ? (
  30. <meta property="og:url" key="og:url" content={seoConfig.url} />
  31. ) : null}
  32. {seoConfig.siteName ? (
  33. <meta
  34. property="og:site_name"
  35. key="og:site_name"
  36. content={seoConfig.siteName}
  37. />
  38. ) : null}
  39. {seoConfig.title ? (
  40. <meta property="og:title" key="og:title" content={seoConfig.title} />
  41. ) : null}
  42. {seoConfig.description ? (
  43. <meta
  44. property="og:description"
  45. key="og:description"
  46. content={seoConfig.description}
  47. />
  48. ) : null}
  49. {seoConfig.img ? (
  50. <meta property="og:image" key="og:image" content={seoConfig.img} />
  51. ) : null}
  52. {seoConfig.title ? (
  53. <meta
  54. name="twitter:title"
  55. key="twitter:title"
  56. content={seoConfig.title}
  57. />
  58. ) : null}
  59. {seoConfig.description ? (
  60. <meta
  61. name="twitter:description"
  62. key="twitter:description"
  63. content={seoConfig.description}
  64. />
  65. ) : null}
  66. {seoConfig.img ? (
  67. <meta
  68. name="twitter:image"
  69. key="twitter:image"
  70. content={seoConfig.img}
  71. />
  72. ) : null}
  73. {seoConfig.canonical ? (
  74. <link rel="canonical" key="canonical" href={seoConfig.canonical} />
  75. ) : null}
  76. {seoConfig.pre ? (
  77. <link
  78. rel="prev"
  79. href={`https://${siteConfig.host}/novel${seoConfig.pre}`}
  80. />
  81. ) : null}
  82. {seoConfig.next ? (
  83. <link
  84. rel="next"
  85. href={`https://${siteConfig.host}/novel${seoConfig.next}`}
  86. />
  87. ) : null}
  88. {seoConfig.jsonLd ? (
  89. <script
  90. type="application/ld+json"
  91. key="application/ld+json"
  92. dangerouslySetInnerHTML={{ __html: seoConfig.jsonLd }}
  93. />
  94. ) : null}
  95. {children}
  96. </Head>
  97. );
  98. }