나만의 이미지 요소(위젯) 통합 (상점 정보 위젯 예시)

어제 나는 위젯을 만드는 문제에 직면했습니다. 쇼핑 정보 설치하기 위해서 우리가 사용하는 온라인 상점에 대한 평가 포털 상인회 사용할 수 있습니다.

안타깝게도 Shopware Store를 통한 플러그인은 없습니다. 따라서 코드를 수동으로 배치해야 했습니다.

이를 위해 먼저 사이트의 백엔드에 상점 정보 위젯을 구성했습니다.

나만의 이미지 요소(위젯) 통합 (상점 정보 위젯 예시)

그 후 코드를 조금 더 깊이 사용할 수 있습니다.

나만의 이미지 요소(위젯) 통합 (상점 정보 위젯 예시)

다음 단계에서 바닥글에 이 코드를 삽입했습니다. FTP 프로그램(예: Filezilla)을 시작하고 다음을 찾습니다.

/테마/프런트엔드/YourThemeName/프론트엔드/색인

이 시점에서 나는 당신이 이미 자신의 테마를 사용하고 있다고 가정합니다. 그렇지 않으면 변경 사항이 업데이트에 안전하지 않을 것입니다. 그렇지 않으면 Shopware에서 다음 문서를 제공합니다.

템플릿 변경

나만의 이미지 요소(위젯) 통합 (상점 정보 위젯 예시)

변경하기 전에 항상 현재 파일의 백업 복사본을 만들고 이름에 현재 날짜를 추가합니다.

텍스트 편집기(예: Notepad++)로 위의 코드를 삽입합니다.

나만의 이미지 요소(위젯) 통합 (상점 정보 위젯 예시)

이제 Shopware 온라인 상점 하단에 위젯이 표시됩니다. 물론 그렇게 좋아 보이지는 않습니다. 따라서 상점 정보는 이 위젯을 오른쪽 하단에 확실하게 배치하는 작은 코드 스니펫을 제공합니다.

@media 전용 화면 및 (최소 너비: 768px) { div#shopauskunft_widget { display: block; 위치: 고정; 오른쪽: 10px; 하단: 10px; }}

그러나 그것으로 무엇을해야합니까?

Showare 백엔드에서 추가 css 파일을 지정할 수 있습니다. 먼저 ftp를 통해 위의 코드로 새 css 파일을 업로드합니다.

나만의 이미지 요소(위젯) 통합 (상점 정보 위젯 예시)

이제 이 파일을 사용해야 한다고 Shopware 5에 알리기만 하면 됩니다. 이렇게 하려면 백엔드로 이동합니다. 설정/테마관리자...

나만의 이미지 요소(위젯) 통합 (상점 정보 위젯 예시)

... 테마를 선택하고 테마 구성을 클릭합니다.

구성 탭에서...

나만의 이미지 요소(위젯) 통합 (상점 정보 위젯 예시)

… "기타 CSS 파일" 아래에 CSS 파일을 입력하십시오.

<link href=“/themes/Frontend/YourThemeName/frontend/_public/src/css/shopauskunft.css?template=itintime_170425&is_preview=on" media="all" rel="stylesheet" type="text/css" />

이제 상점 캐시를 비우고 테마를 컴파일하십시오.

Shopware 5 캐시 지우기

Et voila… 위젯이 멋지게 보입니다! 🙂

나만의 이미지 요소(위젯) 통합 (상점 정보 위젯 예시)

평가 이메일을 보내려면 상점 정보의 RBA 위젯이 여전히 필요합니다. 이 게시물에서 설정하는 방법을 보여 드리겠습니다.

Shopware 5의 상점 정보에서 RBA 위젯 설치