Madrid, 9 y 10 de junio de 2015
Santiago Porras
MVP Windows Platform Development
ENCAMINA
http://geeks.ms/blogs/santypr
http://blogs.encamina.com/en-tu-ca...
Modern Branding en SharePoint
desde todos los ángulos con
HTML5 y Responsive Web
Design
Contenido
■Introducción al Branding
■Introducción los portales de publicación
■El administrador de diseños de SharePoint 2...
Introducción al
Branding
Branding en SharePoint 2013
■ Llegada de HTML5
■ Designer Manager
■ Nuevos conceptos y elementos
■ Cambios en SharePoint D...
¿Cómo debemos aplicar Branding?
■ Definir arquitectura de la información
■ Definir Wireframes y Flujo de Navegación
■ Dise...
Introducción a
los sitios de
publicación
Elementos de
Diseño
Elementos que componen un diseño
Igual que en
SharePoint 2010
Páginas maestras
Diseños de página
Plantillas XSLT
SharePoin...
El administrador
de diseños de
SharePoint 2013
Opciones del administrador de diseños
Subir diseños
Administrar Páginas Maestras
Administrar Diseños de Página
Administrar...
Cómo crear un nuevo diseño
■ Desde cualquier IDE
■ SharePoint Designer 2013 sin Vista Diseño
■ Identificar elementos perte...
CSS y
JavaScript
avanzado en
SharePoint
2013
Recomendaciones
■Principio de responsabilidad
■Sass – CSS con superpoderes
■Protección de jQuery
■Módulos/Namespaces
■Plug...
Desplegando
archivos de
diseño desde
Visual Studio
Despliegue desde Visual Studio
■Por qué usar Visual Studio
■¿Recursos en Style Library o en carpeta Layouts?
■Los módulos ...
Enriqueciendo
la visualización
de resultados
con display
templates
Display Templates
■¿Por qué y para qué?
Modificando
visualización
de elementos
con JSLink
Q&A
Santiago Porras
MVP Windows Platform Development
ENCAMINA
http://geeks.ms/blogs/santypr
http://blogs.encamina.com/en-tu-ca...
Modern Branding en SharePoint desde todos los ángulos con HTML5 y Responsive Web Design
Modern Branding en SharePoint desde todos los ángulos con HTML5 y Responsive Web Design
Modern Branding en SharePoint desde todos los ángulos con HTML5 y Responsive Web Design
Modern Branding en SharePoint desde todos los ángulos con HTML5 y Responsive Web Design
Modern Branding en SharePoint desde todos los ángulos con HTML5 y Responsive Web Design
Modern Branding en SharePoint desde todos los ángulos con HTML5 y Responsive Web Design
Modern Branding en SharePoint desde todos los ángulos con HTML5 y Responsive Web Design
Próxima SlideShare
Cargando en…5
×

Modern Branding en SharePoint desde todos los ángulos con HTML5 y Responsive Web Design

1.153 visualizaciones

Publicado el

Modern Branding en SharePoint desde todos los ángulos con HTML5 y Responsive Web Design - Cómo aplicar branding en SharePoint usando las nuevas tendencias de desarrollo web y desplegando desde Visual Studio

Publicado en: Tecnología
0 comentarios
0 recomendaciones
Estadísticas
Notas
  • Sé el primero en comentar

  • Sé el primero en recomendar esto

Sin descargas
Visualizaciones
Visualizaciones totales
1.153
En SlideShare
0
De insertados
0
Número de insertados
355
Acciones
Compartido
0
Descargas
7
Comentarios
0
Recomendaciones
0
Insertados 0
No insertados

No hay notas en la diapositiva.
  • Introducción al Branding
    Introducción los portales de publicación
    El administrador de diseños de SharePoint 2013
    Mostrar el administrador de diseños y explicar para qué sirve cada una de las opciones
    Personalización de páginas maestras y diseños de página
    Subir una página maestra, convertirla y publicarla
    Crear un diseño de página y editarlo con SharePoint designer
    CSS y JavaScript avanzado en SharePoint
    SASS
    JavaScript
    Módulos
    Plugins de jQuery
    Proteger jQuery
    Enriqueciendo los resultados de las búsquedas mediante display templates
    Crear un display template para mostrar resultados (Control y elemento)
    Aplicar display template en una búsqueda
    Uso de JSLink para mejorar las listas de SharePoint
    Crear fichero de JSLink para modificar la visualización del porcentaje de finalizado de las tareas.
  • _spBodyOnLoadFunctionNames.push('fitContentSection');
    ExecuteOrDelayUntilScriptLoaded(FunctionName, "core.js");
  • Modern Branding en SharePoint desde todos los ángulos con HTML5 y Responsive Web Design

    1. 1. Madrid, 9 y 10 de junio de 2015
    2. 2. Santiago Porras MVP Windows Platform Development ENCAMINA http://geeks.ms/blogs/santypr http://blogs.encamina.com/en-tu-casa-o-en-la-mia @saintwukong SharePoint Developer
    3. 3. Modern Branding en SharePoint desde todos los ángulos con HTML5 y Responsive Web Design
    4. 4. Contenido ■Introducción al Branding ■Introducción los portales de publicación ■El administrador de diseños de SharePoint 2013 ■Personalización de páginas maestras y diseños de página ■CSS y JavaScript avanzado en SharePoint ■Enriqueciendo los resultados de las búsquedas mediante display templates ■Uso de JSLink para mejorar las listas de SharePoint
    5. 5. Introducción al Branding
    6. 6. Branding en SharePoint 2013 ■ Llegada de HTML5 ■ Designer Manager ■ Nuevos conceptos y elementos ■ Cambios en SharePoint Designer ■Con Sharepoint 2016 desaparece SharePoint Designer
    7. 7. ¿Cómo debemos aplicar Branding? ■ Definir arquitectura de la información ■ Definir Wireframes y Flujo de Navegación ■ Diseño gráfico ■
    8. 8. Introducción a los sitios de publicación
    9. 9. Elementos de Diseño
    10. 10. Elementos que componen un diseño Igual que en SharePoint 2010 Páginas maestras Diseños de página Plantillas XSLT SharePoint 2013 Plantillas de elementos de contenido (Display Templates)
    11. 11. El administrador de diseños de SharePoint 2013
    12. 12. Opciones del administrador de diseños Subir diseños Administrar Páginas Maestras Administrar Diseños de Página Administrar Plantillas de elementos de contenido Administrar canales para dispositivos Publicar y aplicar diseños Crear paquetes de diseño
    13. 13. Cómo crear un nuevo diseño ■ Desde cualquier IDE ■ SharePoint Designer 2013 sin Vista Diseño ■ Identificar elementos pertenecientes a la página maestra ■ Convertir diseño a HTML ■ Subir al catálogo de diseño de SharePoint 2013 ■ Crear página maestra ■ Crear diseños de página ■ Crear plantillas XSLT ■ Crear plantillas de elementos de contenido
    14. 14. CSS y JavaScript avanzado en SharePoint 2013
    15. 15. Recomendaciones ■Principio de responsabilidad ■Sass – CSS con superpoderes ■Protección de jQuery ■Módulos/Namespaces ■Plugings de jQuery ■JavaScript como “CodeBehind”
    16. 16. Desplegando archivos de diseño desde Visual Studio
    17. 17. Despliegue desde Visual Studio ■Por qué usar Visual Studio ■¿Recursos en Style Library o en carpeta Layouts? ■Los módulos son nuestros aliados ■XML para configurar nuestros recursos
    18. 18. Enriqueciendo la visualización de resultados con display templates
    19. 19. Display Templates ■¿Por qué y para qué?
    20. 20. Modificando visualización de elementos con JSLink
    21. 21. Q&A
    22. 22. Santiago Porras MVP Windows Platform Development ENCAMINA http://geeks.ms/blogs/santypr http://blogs.encamina.com/en-tu-casa-o-en-la-mia @saintwukong SharePoint Developer

    ×