{"id":18248,"date":"2016-05-20T08:00:31","date_gmt":"2016-05-20T06:00:31","guid":{"rendered":"http:\/\/192.168.20.3\/?p=18248"},"modified":"2024-12-13T10:18:00","modified_gmt":"2024-12-13T09:18:00","slug":"ui-theme-designer-para-sap-fiori","status":"publish","type":"post","link":"https:\/\/orekait.com\/es\/ui-theme-designer-para-sap-fiori\/","title":{"rendered":"UI Theme Designer
para SAP Fiori<\/span>"},"content":{"rendered":"

[et_pb_section fb_built=”1″ admin_label=”section” _builder_version=”4.25.2″ global_colors_info=”{}”][et_pb_row admin_label=”Imagen principal” _builder_version=”4.25.2″ background_size=”initial” background_position=”top_left” background_repeat=”repeat” global_colors_info=”{}”][et_pb_column type=”4_4″ _builder_version=”4.16″ custom_padding=”|||” global_colors_info=”{}” custom_padding__hover=”|||”][et_pb_image alt=”cloud-public” title_text=”Reclamacio\u0301n-de-facturas-vencidas-en-SAP-FI-1″ admin_label=”Imagen principal” module_class=”post-img” _builder_version=”4.25.2″ _module_preset=”default” global_colors_info=”{}”][\/et_pb_image][\/et_pb_column][\/et_pb_row][et_pb_row admin_label=”Cuerpo” _builder_version=”4.25.2″ _module_preset=”default” global_colors_info=”{}”][et_pb_column type=”4_4″ _builder_version=”4.25.2″ _module_preset=”default” global_colors_info=”{}”][et_pb_text content_last_edited=”off|desktop” admin_label=”Texto” _builder_version=”4.25.2″ header_2_font_size=”24px” header_3_font_size=”20px” header_4_font_size=”17px” background_size=”initial” background_position=”top_left” background_repeat=”repeat” width=”%22671%22″ height=”%22251%22″ global_colors_info=”{}” content__hover_enabled=”off|hover”]<\/p>\n

Hace ya un tiempo, hablamos en este blog del\u00a0UI Theme Designer<\/strong>\u00a0<\/a>como una nueva herramienta que ampliaba en gran medida las posibilidades de customizaci\u00f3n de nuestro portal SAP.<\/p>\n

Sin embargo, la aparici\u00f3n de esta herramienta en SAP Portal\u00a0no fue fortuita. B\u00e1sicamente,\u00a0UI Theme Designer\u00a0iba a convertirse en una herramienta clave en la estrategia de lavado de cara de las interfaces de usuario SAP, junto con\u00a0el framework de programaci\u00f3n\u00a0SAPUI5<\/strong>\u00a0y por supuesto junto con\u00a0SAP Fiori<\/strong>.<\/p>\n

En esta ocasi\u00f3n vamos a volver a ver en acci\u00f3n el\u00a0UI Theme Designer<\/strong>, pero para dar estilo a aplicaciones Fiori o aplicaciones UI5 que tengamos publicadas en nuestro SAP Frontend Server como aplicaciones BSP (accesibles desde la transacci\u00f3n SE80).<\/p>\n

 <\/p>\n

Para crear un theme con el que personalizar estas aplicaciones disponemos de la transacci\u00f3n \/ui5\/theme_designer mediante la cual se abrir\u00e1 el mencionado\u00a0UI Theme Designer\u00a0<\/strong>en una pesta\u00f1a de navegador web.<\/p>\n

Como se puede apreciar en la siguiente imagen, el UI Theme Designer es equivalente al que ya conoc\u00edamos en SAP Portal:<\/p>\n

\"\"<\/p>\n

Al iniciarse se muestra la lista de themes actualmente disponibles tanto est\u00e1ndares como no est\u00e1ndares, los cuales es posible abrir, renombrar, reestructurar, duplicar\u2026<\/p>\n

Debemos tener en cuenta cu\u00e1les son los themes est\u00e1ndar de SAP actualmente disponibles para dotar de estilo a las\u00a0aplicaciones UI5<\/strong>, que recordamos son aplicaciones basadas en JavaScript y HTML5. Estos temas son\u00a0sap_bluecrystal<\/strong>,\u00a0sap_goldreflection<\/strong>\u00a0y\u00a0sap_hcb<\/strong>.<\/p>\n

Para crear un theme personalizado, es\u00a0necesario basarse uno de los themes est\u00e1ndar<\/strong>: abrir el theme est\u00e1ndar, realizar sobre \u00e9l las modificaciones que sean convenientes y despu\u00e9s guardar con un nuevo nombre.<\/p>\n

\"\"<\/p>\n

En cualquier caso, UI Theme Designer nos permite\u00a0previsualizar una aplicaci\u00f3n concreta<\/strong>\u00a0con cualquiera de los themes disponibles. Para ello, a\u00f1adimos una \u201cTarget Page\u201d o p\u00e1gina de destino \u00a0indicando la URL de la aplicaci\u00f3n en el server.<\/p>\n

\"\"<\/p>\n

Una vez hecho esto, ser\u00e1 posible abrir la aplicaci\u00f3n con el theme en cuesti\u00f3n e ir probando cambios en el tema sobre esa misma aplicaci\u00f3n:<\/p>\n

Desde el UI Theme Designer podemos modificar el estilo de las aplicaciones en tres niveles:<\/p>\n

R\u00e1pido\u00a0<\/strong><\/h2>\n

En este modo s\u00f3lo se permiten\u00a0modificar aspectos generales<\/strong>\u00a0del estilo como la paleta de colores general.<\/h3>\n

\"\"<\/p>\n

Experto<\/strong><\/h2>\n

En este nivel es posible modificar un\u00a0grupo m\u00e1s amplio de propiedades<\/strong>. As\u00ed mismo estas propiedades se pueden clasificar por categor\u00edas: colores, dimensiones, fuentes, im\u00e1genes\u2026<\/p>\n

\"\"<\/p>\n

CSS<\/strong><\/h2>\n

En este modo, se pueden\u00a0a\u00f1adir nuevas propiedades CSS<\/strong>\u00a0que se priorizar\u00e1n por encima de las definidas por defecto (css)<\/em>.<\/p>\n

\"\"<\/p>\n

Sin duda con\u00a0UI Theme Designer para SAP Fiori<\/strong>, ya no hay excusas para no personalizar y adaptar la interfaz de usuario de las aplicaciones SAP a la imagen corporativa de tu empresa.<\/p>\n

[\/et_pb_text][\/et_pb_column][\/et_pb_row][et_pb_row admin_label=”M\u00e1s informaci\u00f3n” _builder_version=”4.25.2″ _module_preset=”default” global_colors_info=”{}”][et_pb_column type=”4_4″ _builder_version=”4.25.2″ _module_preset=”default” global_colors_info=”{}”][et_pb_text _builder_version=”4.25.2″ _module_preset=”default” global_colors_info=”{}”]<\/p>\n

M\u00e1s informaci\u00f3n:<\/p>\n

[\/et_pb_text][et_pb_button button_url=”https:\/\/orekait.com\/es\/area-personalizacion” button_text=”M\u00e1s informaci\u00f3n” module_class=”entrada-btn” _builder_version=”4.25.2″ _module_preset=”default” custom_button=”on” button_text_color=”#8156EA” button_bg_color=”RGBA(255,255,255,0)” button_border_color=”#8156EA” button_border_radius=”30px” button_font=”Plus Jakarta Sans|600|||||||” button_icon=”$||divi||400″ button_icon_color=”#8156EA” button_on_hover=”off” hover_enabled=”0″ global_colors_info=”{}” button_text_color__hover_enabled=”on|desktop” button_text_color__hover=”#8156EA” button_bg_color__hover_enabled=”on|hover” button_bg_color__hover=”#8156EA” button_bg_enable_color__hover=”on” button_icon_color__hover_enabled=”on|hover” button_icon_color__hover=”#ffffff” url_new_window=”on” sticky_enabled=”0″][\/et_pb_button][et_pb_divider show_divider=”off” _builder_version=”4.25.2″ _module_preset=”default” custom_margin=”||40px||false|false” global_colors_info=”{}”][\/et_pb_divider][\/et_pb_column][\/et_pb_row][et_pb_row use_custom_gutter=”on” admin_label=”Noticias relacionadas titulo” module_id=”fondo-articulos” _builder_version=”4.25.2″ _module_preset=”default” background_color=”#f7f7f7″ width=”100%” collapsed=”off” global_colors_info=”{}”][et_pb_column type=”4_4″ _builder_version=”4.25.2″ _module_preset=”default” global_colors_info=”{}”][et_pb_divider show_divider=”off” _builder_version=”4.25.2″ _module_preset=”default” background_color=”RGBA(255,255,255,0)” custom_margin=”||40px||false|false” global_colors_info=”{}”][\/et_pb_divider][et_pb_heading title=”Quizas te pueda interesar” _builder_version=”4.25.2″ _module_preset=”default” title_level=”h2″ title_text_align=”center” global_colors_info=”{}”][\/et_pb_heading][et_pb_divider show_divider=”off” _builder_version=”4.25.2″ _module_preset=”default” custom_margin=”||30px||false|false” global_colors_info=”{}”][\/et_pb_divider][\/et_pb_column][\/et_pb_row][et_pb_row admin_label=”Noticias relacionadas” _builder_version=”4.25.2″ _module_preset=”default” width=”100%” custom_margin=”-150px||||false|false” custom_margin_tablet=”0px||||false|false” custom_margin_phone=”0px||||false|false” custom_margin_last_edited=”on|desktop” global_colors_info=”{}”][et_pb_column type=”4_4″ _builder_version=”4.25.2″ _module_preset=”default” global_colors_info=”{}”][et_pb_blog fullwidth=”off” posts_number=”3″ include_categories=”current” show_author=”off” show_date=”off” show_pagination=”off” _builder_version=”4.25.2″ _module_preset=”default” global_colors_info=”{}”][\/et_pb_blog][\/et_pb_column][\/et_pb_row][\/et_pb_section]<\/p>\n","protected":false},"excerpt":{"rendered":"

Hace ya un tiempo, hablamos en este blog del\u00a0UI Theme Designer\u00a0como una nueva herramienta que ampliaba en gran medida las posibilidades de customizaci\u00f3n de nuestro portal SAP. Sin embargo, la aparici\u00f3n de esta herramienta en SAP Portal\u00a0no fue fortuita. B\u00e1sicamente,\u00a0UI Theme Designer\u00a0iba a convertirse en una herramienta clave en la estrategia de lavado de cara […]<\/p>\n","protected":false},"author":3,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_et_pb_use_builder":"on","_et_pb_old_content":"Lorem ipsum dolor sit amet consectetur adipiscing elit congue montes, imperdiet taciti erat elementum fermentum sem ante ultrices ridiculus, sagittis sociis egestas quisque ac semper quis odio. Aenean hendrerit ac metus dis nascetur aliquet mollis integer, rutrum vel laoreet posuere proin sagittis luctus est, tempus duis nisl ultrices parturient tempor praesent. Dignissim curabitur nascetur pellentesque augue fringilla pulvinar eros, tempus fames vehicula maecenas cubilia id, rutrum euismod integer ut scelerisque mus.\r\n\r\nVivamus auctor odio aenean rhoncus natoque dictum purus, volutpat pellentesque laoreet ridiculus consequat nisi varius euismod, augue platea convallis curae magnis taciti. Imperdiet nibh curabitur quisque orci consequat aenean pellentesque, cubilia duis senectus felis sed posuere tortor, magnis enim diam a odio sociis. Enim tellus nisl nec molestie augue luctus tempor habitant, nunc dictumst phasellus volutpat sem facilisis taciti, habitasse laoreet at turpis vel fermentum vulputate.","_et_gb_content_width":"","footnotes":""},"categories":[53,52,51],"tags":[],"class_list":["post-18248","post","type-post","status-publish","format-standard","hentry","category-sap-fiori-ux","category-sapui5","category-user-experience-integracion"],"_links":{"self":[{"href":"https:\/\/orekait.com\/es\/wp-json\/wp\/v2\/posts\/18248","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/orekait.com\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/orekait.com\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/orekait.com\/es\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/orekait.com\/es\/wp-json\/wp\/v2\/comments?post=18248"}],"version-history":[{"count":3,"href":"https:\/\/orekait.com\/es\/wp-json\/wp\/v2\/posts\/18248\/revisions"}],"predecessor-version":[{"id":22568,"href":"https:\/\/orekait.com\/es\/wp-json\/wp\/v2\/posts\/18248\/revisions\/22568"}],"wp:attachment":[{"href":"https:\/\/orekait.com\/es\/wp-json\/wp\/v2\/media?parent=18248"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/orekait.com\/es\/wp-json\/wp\/v2\/categories?post=18248"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/orekait.com\/es\/wp-json\/wp\/v2\/tags?post=18248"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}