Let's look at how to change the default Favicon Icons, Title, and Description text before we deploy the React App.
1/3 THE ICON
- Use the Graphic software of your choice to design an icon.
- Export the icon in 4 files with the following details.
- favicon.ico → 64px by 64px
- logo192.png → 192px by 192px
- logo512.png → 512px by 512px
- Replace the logo.svg in the src directory of your React Project with the one you've just made and exported.
- Navigate to the public directory of your React project and replace the respective files with the favicon, logo192, and the logo512 you've just designed and exported.
2/3 THE TITLE TEXT
- Open the index.html file found in the public directory
- Edit the text in the Title tag.
- Edit the text in the content attribute of the meta tag which has a description attribute.
3/3 THE DESCRIPTION TEXT
- Open the manifest.json file
- Edit the text in the short_name and name keys
Found this helpful? Share, Like, and comment. Take a minute to follow me on Twitter @davidofug