Breaking News: Grepper is joining You.com. Read the official announcement!

how to change favicon dynamic in react js

Add Answer

Bad Beaver answered on July 27, 2021 Popularity 10/10 Helpfulness 4/10

answer how to change favicon dynamic in react js

related change favicon in react

related reactjs change favicon

how to change favicon dynamic in react js

Comment

import React from "react";

function getFaviconEl() {
  return document.getElementById("favicon");
}

function App() {

  const handleGoogle = () => {
    const favicon = getFaviconEl(); // Accessing favicon element
    favicon.href = "https://www.google.com/favicon.ico";  };

  const handleYoutube = () => {
    const favicon = getFaviconEl();
    favicon.href = " https://s.ytimg.com/yts/img/favicon-vfl8qSV2F.ico";  };

  return (
    <div className="App">
      <h1>Dynamically changing favicon</h1>
      <button onClick={handleGoogle}>Google</button>      <button onClick={handleYoutube}>YouTube</button>    </div>
  );
}

export default App;

Popularity 10/10 Helpfulness 4/10 Language javascript

Source: reactgo.com

Tags: dynamic favicon javascript

Link to this answer
Share Copy Link

Contributed on Aug 25 2021

Bad Beaver

0 Answers Avg Quality 2/10

Closely Related Answers

change favicon in react

Comment

<!DOCTYPE html>
<html lang="en">
  <head>
    ...
    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
    ...
  </head>
  <body>
    ...
  </body>
</html>

Popularity 9/10 Helpfulness 5/10 Language html

Source: Grepper

Link to this answer
Share Copy Link

Contributed on Sep 12 2023

YOU.com

0 Answers Avg Quality 2/10

reactjs change favicon

Comment

1. Open the react app in your favorite code editor.
2. Navigate to the public folder and delete the favicon.ico file.
3. Now, add a new favicon inside the public folder.

Popularity 10/10 Helpfulness 2/10 Language javascript

Source: reactgo.com

Tags: favicon

Link to this answer
Share Copy Link

Contributed on Jul 27 2021

GutoTrosla

0 Answers Avg Quality 2/10

how to change favicon dynamic in react js

Contents

More Related Answers

how to change favicon dynamic in react js

Closely Related Answers

change favicon in react

reactjs change favicon

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.