News:

Want to get involved in developing SMF, then why not lend a hand on our github!

Main Menu

Añadir a la pantalla de inicio nuestro foro en iOS/Android con icono

Started by jemaral, February 19, 2022, 05:12:38 AM

Previous topic - Next topic
Print
Go Down Pages1
User actions

jemaral

February 19, 2022, 05:12:38 AM
En dispositivos Apple (iOS) si abrimos en Safari nuestro foro al hacer clic en el cuadrado con la flecha (el signo de "compartir") nos aparece la opción "Añadir a la pantalla de inicio". Eso nos permite tener un acceso directo desde el escritorio de iOS en iPhone/iPad. Similar es en Android entiendo.

El caso es que quiero que al hacer eso se cargue la imagen/logo del foro en dicho acceso directo, y he encontrado este sitio https://es.stealthsettings.com/cum-adaugam-unui-website-iconite-pentru-iphone-ipad-si-ipod-touch.html que habla de cómo hacerlo en .html pero tengo dudas para poder implementarlo en un entorno de SMF.

¿Alguien lo ha probado?

-Rock Lee-

#1
February 19, 2022, 10:52:58 AM
Al poner en la raiz del sitio levanta automaticamente el formato .ico no he probado el html pero no deberia tener problemas al funcionar, aunque no tengo ningun dispositivo apple para probarlo a fondo.


Saludos!
¡Regresando como cual Fenix! ~ Bomber Code
Ayudas - Aportes - Tutoriales - Y mucho mas!!!

jemaral

#2
February 20, 2022, 11:33:38 AM
Pues probando lo más simple posible ha funcionado en iOS: Sólo hay que subir a la carpeta raíz el archivo de imagen .png con el siguiente nombre: apple-touch-icon.png.  Luego desde Safari se selecciona la opción "Añadir a la pantalla de inicio" y lo agrega perfectamente al escritorio en iOS con nuestro .png  :D

Si alguien sabe cómo funciona en Android...

-Rock Lee-

#3
February 20, 2022, 09:52:07 PM
Debe funcionar similar solo especificando sea para android, aunque sino toma el formato simple al agregarlo.


Saludos!

Agrego: Lo acabo de probar lo implementaron en chrome 98.0.47xx y toma la imagen .ico simple o generado por el explorador, voy probar con firefox mobile y te digo mejor!
¡Regresando como cual Fenix! ~ Bomber Code
Ayudas - Aportes - Tutoriales - Y mucho mas!!!

jemaral

#4
February 21, 2022, 04:17:53 PM
He estado mirando esta utilidad genial para obtener todos los formatos de android/windows/iOS/etc... https://realfavicongenerator.net/ y el resultado es genial, sólo me queda la duda de dónde configurar este código en html (Insert the following code in the <head> section of your pages):

Code Select
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="/site.webmanifest">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="theme-color" content="#ffffff">

vicram10

#5
February 22, 2022, 06:38:42 AM
Diria yo que podes configurarlo en el index.template.php de tu theme.

Busca el tag: </head> y agrega antes de ese tag, el codigo que tenes.

jemaral

#6
February 22, 2022, 02:23:30 PM Last Edit: February 22, 2022, 02:34:32 PM by jemaral
Quote from: vicram10 on February 22, 2022, 06:38:42 AMDiria yo que podes configurarlo en el index.template.php de tu theme.

Busca el tag: </head> y agrega antes de ese tag, el codigo que tenes.

Pues funciona, aunque no tengo un dispositivo android para probar, en el emulador para android siguiente funciona perfectamente. Os lo comparto por si os sirve.

https://www.apkonline.net/runapk/create-androidapk.html?app=android_6.0_blank

Gracias!
Print
Go Up Pages1
User actions
Advertisement: