Written by nodejs-style
on 2021-10-09

모든 소셜 미디어에서 블로그를 공유하기 위한 옵션 추가 @dsabyte.com

반응형

오늘 저는 소셜 미디어에서 블로그를 직접 공유하는 옵션을 추가했습니다. 이를 위해 블로그의 실제 URL을 생성하고 각 소셜 미디어 공유 URL에 이 URL을 추가했습니다.

티치 스택

리액션즈

넥스트즈

nodejs

급행열차

차크라 의

리액션 아이콘

이 기능을 사용하려면 이 블로그로 이동한 후 아래로 스크롤하십시오.

그런 다음 공유 아이콘을 클릭합니다.

이걸 어떻게 만들었지?

워크플로우

공유 아이콘 표시

사용자가 공유 아이콘을 클릭한 경우 모달 표시

그러면 사용자는 블로그를 공유하기 위해 소셜 미디어 아이콘을 클릭할 수 있다.

import { IconButton, Icon, Modal, ModalOverlay, ModalContent, ModalHeader, ModalBody, ModalCloseButton, useDisclosure, HStack, } from "@chakra-ui/react"; import { FiShare2 } from "react-icons/fi"; import { FaLinkedin, FaTwitter, FaFacebook } from "react-icons/fa"; import { RiWhatsappFill } from "react-icons/ri"; const SocialIconLink = ({ url, as, color }) => ( ); export default function SocialShare({ url }) { const { isOpen, onOpen, onClose } = useDisclosure(); return ( <> } variant="ghost" /> Share on social media ); }

from http://every-issue.tistory.com/7 by ccl(A) rewrite - 2021-10-09 01:26:55

Top