Docs

Extras

Enhance your ShipFree application with the following customizations:

Place your logo in the /app directory and name it icon.png. Next.js will automatically reference this file as your application’s icon.

Note: If you’re using a different file format, update the components that reference icon.png accordingly.

2. Set Up a Favicon

Create a favicon for your site using a Favicon Generator . After generating, download the zip file and extract apple-touch-icon.png and favicon.ico.

  • Rename apple-touch-icon.png to apple-icon.png.
  • Place both apple-icon.png and favicon.ico in the /app directory.

Next.js will automatically reference these files in the <head> of your HTML pages. citeturn0search4

This setup ensures your custom logo appears on the authentication pages. citeturn0search3

3. Optimize Social Media Sharing

Create two images with dimensions 1200x660 pixels:

  • opengraph-image.png
  • twitter-image.png

Place these images in the /app directory. Next.js will automatically reference them in the <head> of your HTML pages, enhancing link previews on social media platforms. citeturn0search6

Useful Resources

Enhance your development with these tools:

By implementing these customizations, you can tailor ShipFree to better fit your brand and enhance user experience.