---
title: Cómo integrar el portal iF en SFCC
description: Esta guía explica cómo incrustar el portal de devoluciones iF dentro de su sitio web o aplicación Salesforce Commerce Cloud (SFCC )mediante un iframe y cómo personalizar su idioma, dimensiones y colores
---

[Ir directamente al contenido](https://help.ifreturns.com/es/knowledge-center/cómo-integrar-el-portal-if-en-sfcc#main-content)

- [Español](https://help.ifreturns.com/es/knowledge-center/c%C3%B3mo-integrar-el-portal-if-en-sfcc)
- [English](https://help.ifreturns.com/en/knowledge-center/how-to-embed-portal)
- [Italiano](https://help.ifreturns.com/it/knowledge-center/come-integrare-if-portal-in-sfcc)

Español

Traducciones de Mostrar submenú de

[Portal del cliente](https://help.ifreturns.com/tickets-view?hsLang=es)

![Logo Negativo-4.png\]](https://help.ifreturns.com/hs-fs/hubfs/Logo%20Negativo-4.png?height=40&name=Logo%20Negativo-4.png)

Abrir navegación principal

Cerrar navegación principal

- - [Español](https://help.ifreturns.com/es/knowledge-center/c%C3%B3mo-integrar-el-portal-if-en-sfcc)
    - [English](https://help.ifreturns.com/en/knowledge-center/how-to-embed-portal)
    - [Italiano](https://help.ifreturns.com/it/knowledge-center/come-integrare-if-portal-in-sfcc)

  Español
  
  Traducciones de Mostrar submenú de
- [Portal del cliente](https://help.ifreturns.com/tickets-view)
- Ir a ifreturns.com

 Ir a ifreturns.com

 ¿Cómo podemos ayudarle?

- No hay sugerencias porque el campo de búsqueda está vacío.

1. [Knowledge Center](https://help.ifreturns.com/es/knowledge-center?hsLang=es)
2. [Primeros pasos](https://help.ifreturns.com/es/knowledge-center/primeros-pasos?hsLang=es)
3. [Configuraciones del portal de retorno](https://help.ifreturns.com/es/knowledge-center/primeros-pasos?hsLang=es#configuraciones-del-portal-de-retorno)

# Cómo integrar el portal iF en SFCC

## Esta guía explica cómo incrustar el portal de devoluciones iF dentro de su sitio web o aplicación Salesforce Commerce Cloud (SFCC )mediante un iframe y cómo personalizar su idioma, dimensiones y colores

#### Guía de Integración-Portal iF en Iframe

#### **1. Idioma:**

El portal admite varios idiomas. Puede establecer el idioma cambiando la ruta de la URL:

- Alemán → `/de/`
- Inglés → `/en/`
- Español → `/es/`
- Francés → `/fr/`
- Italiano → `/it/`
- Portugués → `/pt/`

***Ejemplos***

- Portal Español:
  
    - https://go.dev.ifreturns.com**/es/**marchelacolombine-refund-v2?source=IFRAME

- Portal Inglés  
    - https://go.dev.ifreturns.com**/en/**marchelacolombine-refund-v2?source=IFRAME

📌Simplemente reemplace el código de idioma en la URL con una de las opciones admitidas.

 

📌 Importante: Siempre debe incluir el parámetro source = IFRAME en la URL. Sin él, el portal no se cargará correctamente dentro de un iframe.

También se pueden pasar dos parámetros de color a través de la URL.

 

#### 2. Tamaño

Puede controlar las dimensiones del portal utilizando los estilos de **iframe** en los que está incrustado.

 ***Ejemplo 1 – Full available space***

\<iframe  
  class="h-full w-full"  
  src="https://go.dev.ifreturns.com/es/marchelacolombine-refund-v2?source=IFRAME&layerColor=D1FAE5&accentColor=ECFDF5"  
\>\</iframe\>

👉 El iframe se expandirá para llenar completamente su contenedor principal.

 

***Ejemplo 2 – Fixed container with background***

\<div class="h-\[42rem\] w-full bg-\[#f5d4d7\]"\>

    \<iframe

        class="h-full w-full"                                                                                                         src="https://go.dev.ifreturns.com/es/marchelacolombine-refund-v2?                        source=IFRAME&layerColor=D1FAE5&accentColor=ECFDF5"

      \>\</iframe\>

\</div\>

👉 Aquí el contenedor tiene una altura fija (42rem) y un color de fondo personalizado (#f5d4d7). El iframe se adapta al tamaño del contenedor.

 

Tamaño mínimo recomendado para escritorio:

- **Ancho: 900px**
- **Altura: 640 píxeles**

⚡ El portal es receptivo y se adaptará al espacio disponible, pero estos valores se recomiendan para una experiencia de escritorio óptima.

 

#### 3. Estilo

Los colores del portal (️️El valor debe pasarse sin el símbolo#.) se puede personalizar pasando los siguientes parámetros en la URL:

- **layerColor (Primary):**
  
    - Se utiliza para fondos generales y fondos emergentes.
      
      ![](https://help.ifreturns.com/hs-fs/hubfs/image-png-Sep-15-2025-07-50-47-5695-AM.png?width=688&height=494&name=image-png-Sep-15-2025-07-50-47-5695-AM.png)
    - Valor predeterminado (si no se proporciona): `#f9fafb`.
- **accentColor (Secondary):**
  
    - Se utiliza para opciones seleccionables, fondos internos y bordes de elementos seleccionables.
      
      ![](https://help.ifreturns.com/hs-fs/hubfs/image-png-Sep-15-2025-07-52-21-1462-AM.png?width=688&height=498&name=image-png-Sep-15-2025-07-52-21-1462-AM.png)
    - Valor predeterminado (si no se proporciona): `#ffffff`.

***Ejemplo***

https://go.dev.ifreturns.com/en/marchelacolombine-refund-v2?source=IFRAME&layerColor=D1FAE5&accentColor=ECFDF5

 

#### **Pasos de integración:**

1. Incluya siempre el parámetro source = IFRAME con el valor IFRAME.
2. Elija el idioma correcto (`de`, `en`, `es`, `fr`, `it`, or `pt`).
3. Defina los colores de su marca usando `layerColor` y `accentColor`.
4. Incruste el iframe en su aplicación.
   
     - Para ancho/alto completo → usa `h-full w-full`.
     - Para un tamaño fijo → envuélvalo dentro de un contenedor con alto/ancho predefinido.
5. (Opcional) Agregue un color de fondo al contenedor para que coincida mejor con la marca.

- [Consultas o incidencias](https://help.ifreturns.com/es/knowledge-center/consultas-o-incidencias?hsLang=es)
- [Configuraciones](https://help.ifreturns.com/es/knowledge-center/configuraciones?hsLang=es)
- [Primeros pasos](https://help.ifreturns.com/es/knowledge-center/primeros-pasos?hsLang=es#main-content)

    - [Descripción general del portal](https://help.ifreturns.com/es/knowledge-center/primeros-pasos?hsLang=es#descripci%C3%B3n-general-del-portal)
    - [Analítica](https://help.ifreturns.com/es/knowledge-center/primeros-pasos?hsLang=es#anal%C3%ADtica)
    - [Configuraciones en la aplicación](https://help.ifreturns.com/es/knowledge-center/primeros-pasos?hsLang=es#configuraciones-en-la-aplicaci%C3%B3n)
    - [Configuraciones del portal de retorno](https://help.ifreturns.com/es/knowledge-center/primeros-pasos?hsLang=es#configuraciones-del-portal-de-retorno)
    - [Configuraciones del Portal de devolución de UX / UI](https://help.ifreturns.com/es/knowledge-center/primeros-pasos?hsLang=es#configuraciones-del-portal-de-devoluci%C3%B3n-de-ux-ui)
    - [Crea tu politica de devoluciones](https://help.ifreturns.com/es/knowledge-center/primeros-pasos?hsLang=es#crea-tu-politica-de-devoluciones)
    - [Personalizaciones](https://help.ifreturns.com/es/knowledge-center/primeros-pasos?hsLang=es#personalizaciones)
- [Reembolsos](https://help.ifreturns.com/es/knowledge-center/reembolsos?hsLang=es#main-content)

    - [Descripción general](https://help.ifreturns.com/es/knowledge-center/reembolsos?hsLang=es#descripci%C3%B3n-general)
    - [Método de Reembolso](https://help.ifreturns.com/es/knowledge-center/reembolsos?hsLang=es#m%C3%A9todo-de-reembolso)
    - [Otras configuraciones](https://help.ifreturns.com/es/knowledge-center/reembolsos?hsLang=es#otras-configuraciones)
- [Gestión de devoluciones](https://help.ifreturns.com/es/knowledge-center/gesti%C3%B3n-de-devoluciones?hsLang=es#main-content)

    - [Operaciones diarias](https://help.ifreturns.com/es/knowledge-center/gesti%C3%B3n-de-devoluciones?hsLang=es#operaciones-diarias)
    - [Métodos de Devolución](https://help.ifreturns.com/es/knowledge-center/gesti%C3%B3n-de-devoluciones?hsLang=es#m%C3%A9todos-de-devoluci%C3%B3n)
    - [Motivos de Devolución](https://help.ifreturns.com/es/knowledge-center/gesti%C3%B3n-de-devoluciones?hsLang=es#motivos-de-devoluci%C3%B3n)
    - [Políticas de Devoluciones](https://help.ifreturns.com/es/knowledge-center/gesti%C3%B3n-de-devoluciones?hsLang=es#pol%C3%ADticas-de-devoluciones)
- [Configuración de Reglas](https://help.ifreturns.com/es/knowledge-center/configuraci%C3%B3n-de-reglas?hsLang=es#main-content)

    - [Información general](https://help.ifreturns.com/es/knowledge-center/configuraci%C3%B3n-de-reglas?hsLang=es#informaci%C3%B3n-general)
    - [Acciones](https://help.ifreturns.com/es/knowledge-center/configuraci%C3%B3n-de-reglas?hsLang=es#acciones)
    - [Condiciones](https://help.ifreturns.com/es/knowledge-center/configuraci%C3%B3n-de-reglas?hsLang=es#condiciones)
    - [Operadores](https://help.ifreturns.com/es/knowledge-center/configuraci%C3%B3n-de-reglas?hsLang=es#operadores)
    - [Las reglas más comunes](https://help.ifreturns.com/es/knowledge-center/configuraci%C3%B3n-de-reglas?hsLang=es#las-reglas-m%C3%A1s-comunes)
- [Integraciones de envío](https://help.ifreturns.com/es/knowledge-center/integraciones-de-env%C3%ADo?hsLang=es)
- [Facturas / Documentos](https://help.ifreturns.com/es/knowledge-center/facturas-documentos?hsLang=es)
- [Notas de publicación](https://help.ifreturns.com/es/knowledge-center/notas-de-publicaci%C3%B3n?hsLang=es#main-content)

    - [Notas de publicación 1.1](https://help.ifreturns.com/es/knowledge-center/notas-de-publicaci%C3%B3n?hsLang=es#notas-de-publicaci%C3%B3n-1-1)
    - [Notas de publicación 1.2](https://help.ifreturns.com/es/knowledge-center/notas-de-publicaci%C3%B3n?hsLang=es#notas-de-publicaci%C3%B3n-1-2)
    - [Notas de publicación 1.3](https://help.ifreturns.com/es/knowledge-center/notas-de-publicaci%C3%B3n?hsLang=es#notas-de-publicaci%C3%B3n-1-3)
    - [Notas de publicación 1.4](https://help.ifreturns.com/es/knowledge-center/notas-de-publicaci%C3%B3n?hsLang=es#notas-de-publicaci%C3%B3n-1-4)
    - [Notas de publicación 2.0](https://help.ifreturns.com/es/knowledge-center/notas-de-publicaci%C3%B3n?hsLang=es#notas-de-publicaci%C3%B3n-2-0)
    - [Notas de publicación 2.1](https://help.ifreturns.com/es/knowledge-center/notas-de-publicaci%C3%B3n?hsLang=es#notas-de-publicaci%C3%B3n-2-1)
    - [Notas de publicación 2.2](https://help.ifreturns.com/es/knowledge-center/notas-de-publicaci%C3%B3n?hsLang=es#notas-de-publicaci%C3%B3n-2-2)
    - [Notas de publicación 2.3](https://help.ifreturns.com/es/knowledge-center/notas-de-publicaci%C3%B3n?hsLang=es#notas-de-publicaci%C3%B3n-2-3)
    - [Notas de publicación 3.0](https://help.ifreturns.com/es/knowledge-center/notas-de-publicaci%C3%B3n?hsLang=es#notas-de-publicaci%C3%B3n-3-0)
    - [Notas de publicación 3.1](https://help.ifreturns.com/es/knowledge-center/notas-de-publicaci%C3%B3n?hsLang=es#notas-de-publicaci%C3%B3n-3-1)
    - [Notas de publicación 3.2](https://help.ifreturns.com/es/knowledge-center/notas-de-publicaci%C3%B3n?hsLang=es#notas-de-publicaci%C3%B3n-3-2)
    - [Notas de publicación 4.2](https://help.ifreturns.com/es/knowledge-center/notas-de-publicaci%C3%B3n?hsLang=es#notas-de-publicaci%C3%B3n-4-2)
    - [Notas de publicación 5.0](https://help.ifreturns.com/es/knowledge-center/notas-de-publicaci%C3%B3n?hsLang=es#notas-de-publicaci%C3%B3n-5-0)
- [Preguntas Frecuentes](https://help.ifreturns.com/es/knowledge-center/preguntas-frecuentes?hsLang=es)

[![Chill listening crop-3](https://help.ifreturns.com/hs-fs/hubfs/iF%20brand/brand-logo.png?width=33&height=24&name=brand-logo.png "Chill listening crop-3")](https://www.ifreturns.com/)

Knowledge center iF returns

<https://www.linkedin.com/company/ifreturns/> <https://www.instagram.com/ifreturns/>

Copyright © 2026, iF Returns