Vercel’s Post

Vercel reposted this

View profile for Delba de Oliveira, graphic

DX Engineer at Vercel

Next.js file-based Metadata: Favicons Drop a `favicon.ico` file into the `/app` folder and Next.js will automatically generate the correct `<head>` metadata for you.

Javier Sánchez

Founding Engineer @ Stack AI (YC W23) | Making AI for everyone

1mo

Hey Delba, at StackAI we want clients to upload their favicons for building their applications. How can we do it?

Brendan K. Schatzki

Software Engineer @ WeHaventLaunchedYet // I overengineer stuff until stuff is simple

1mo

Thoughts on using the icons property of the metadata object to point to the favicon in lieu of this?

Carlos Chao Cortes

Principal Software Engineer | Developer Advocate | Web Development Enthusiast | My Youtube Channel ElFrontend

1mo

Delba de Oliveira what app do you use to generate these animations?

Vladyslav Vagin

Fullstack Web Developer (React, Next, Node, Nest)

1mo

The best way to set all metadata ( including favicons) in Next.js is using metadata object. I had project where on every page of app I should change metadata and favicons for SEO. Next.js will automatically read metadata object 👌

Muhammad Junaid Tariq

🖥️ Full-stack Developer 🖥️ WordPress 🛍️ Shopify ▬ React.js ▬ Next.js ▬ Python ▬ API Development ▬ PostgreSQL ▬ Docker ▬ Kafka 🎨 Figma ▬ Adobe Photoshop 🔍 On-page SEO & Technical SEO

1mo

Hey Delba de Oliveira thank you for sharing. I update the meta tags , but will you please make a video related to open graph tags. How to implement the open graph tags.

Like
Reply
Antoine BERNIER

Web Developer (Freelance)

1mo

Delba de Oliveira this is nice really. Further, what about: Drop a `favicon.svg` file into the `/app` folder and Next.js will automatically generate the correct `<head>` metadata and all the variants for you (ico, sizes, manifest...etc) this would be a dream

Quintin Maseyk

Principal Consultant at Mechanical Rock

1mo

Great start. Though does this mean we still need to manage the other variants of favicons? ie sizes, mask-icons, apple-touch-icons

Like
Reply
Sohan Prabhath Weerasinghe

Trainee - Software Engineer at nCloud Solutions | Undergraduate at Institute of Technology, University of Moratuwa

1mo

Are there any updates on route base ico's .I think still we should have to code in meta data section for that particular routes. subroutes also doesnot support that ico and that replace with the main ico

Like
Reply
Jose Maria Chico Lopez

FullStack JS Developer 💛 | Backend Developer 👨🏻💻 | Devu Community Co-Founder 🧑🌾

1mo

Excuse me, what color theme do you use? Looks so nice

Diego Vergara Casanova

Fullstack developer in Flow S.A

1mo

What version of nextjs are you using for that?

Like
Reply
See more comments

To view or add a comment, sign in

Explore topics