CSS 오버라이드를 통해 결과 창 사용자 지정 및 시각적 변경
사용자 지정 CSS를 사용하여 지금 구매 팝업 상자의 현재 스타일을 재정의할 수 있습니다. 다음 템플릿을 사용할 수 있습니다.
필요에 따라 파일에 설명된 클래스를 편집하기만 하면 됩니다. 그런 다음 지금 구매 스크립트를 임베드한 후 페이지 또는 <style> 태그 내에 사용자 정의된 CSS 파일을 포함하십시오.
참고: 지금 구매 스크립트 태그 전에 파일을 삽입하면 문서 순서가 중요하므로 스타일시트가 특정 값을 무시하지 못할 수 있습니다. 경우에 따라 사용자 지정 스타일을 !important 로 장식해야 할 수도 있습니다 . 스타일 속성을 덮어쓰지 않는 경우 규칙(자세한 내용은 https://www.w3schools.com/css/css_important.asp 방문 ). 아래 차트는 클래스의 주요 섹션이 수행하는 작업에 대한 일반적인 정보를 제공합니다. 덮어쓸 수 있는 각 기본 섹션 내에 중첩된 많은 태그가 있습니다.
| 팁: 브라우저 "검사" 도구(예: Google Chrome 또는 Microsoft Edge에 내장된 도구)를 사용하는 것이 좋습니다. 이 도구는 스타일을 지정할 수 있는 특정 CSS 클래스와 HTML 태그를 분리하는 데 유용할 수 있습니다. 검사 도구를 사용하여 속성을 수정하여 속성이 어떻게 보이는지 확인합니다. |
/* Omacro 모달 팝업 외부 클래스 */
.oma-buynow.oma-modal { }
.oma-buynow.oma-modal .oma-dialog .oma-content { }
/* Omacro Modal Popup Header(창 닫기 아이콘을 포함하는 팝업 창의 제목 표시줄 부분) */
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-header { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-header .oma-close { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-header .oma-title { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-header .oma-title span { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-header .oma-title small { }
/* Omacro 모달 팝업 헤더 탭(온라인 소매업체 및 지역 소매업체 탭) */
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-tabs { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-tabs .oma-active { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-tabs li { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-tabs li a { }
/* Omacro 모달 팝업 본체 */
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-active { } /* 활성 탭 */
/* Omacro Modal Popup Main Body (온라인 판매점 컨텐츠) */
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-online-tab { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-online-tab .oma-market.oma-online-market { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-online-tab .oma-market.oma-online-market .oma-loading { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-online-tab .oma-market.oma-online-market .oma-loading .oma -스피너 { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-online-tab .oma-market.oma-online-market .oma-result-filters { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-online-tab .oma-market.oma-online-market .oma-results { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-online-tab .oma-market.oma-online-market .oma-results .oma -retailer.your-online-retailer { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-online-tab .oma-market.oma-online-market .oma-results .oma -retailer.oma-online-retailer .oma-card { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-online-tab .oma-market.oma-online-market .oma-results .oma -retailer.oma-online-retailer .oma-card .oma-image { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-online-tab .oma-market.oma-online-market .oma-results .oma -retailer.oma-online-retailer .oma-card .oma-image img { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-online-tab .oma-market.oma-online-market .oma-results .oma -retailer.oma-online-retailer .oma-card .oma-info { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-online-tab .oma-market.oma-online-market .oma-results .oma -retailer.oma-online-retailer .oma-card .oma-info .oma-name { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-online-tab .oma-market.oma-online-market .oma-results .oma -retailer.oma-online-retailer .oma-card .oma-info .oma-button.oma-buylink { }
/* Omacro Modal Popup Main Body (현지 판매점 컨텐츠) */
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-local-tab { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-local-tab .oma-market.oma-local-market { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-local-tab .oma-market.oma-local-market .oma-map { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-local-tab .oma-market.oma-local-market .oma-map .oma -구글지도 { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-local-tab .oma-market.oma-local-market .oma-results { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-local-tab .oma-market.oma-local-market .oma-results .oma -호출기 { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-local-tab .oma-market.oma-local-market .oma-results .oma -소매업체 { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-local-tab .oma-market.oma-local-market .oma-results .oma -소매업자 .own-retailer.own-local-retailer { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-local-tab .oma-market.oma-local-market .oma-results .oma -소매업체 .oma-소매업체.oma-지역 소매업체 .oma-카드 { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-local-tab .oma-market.oma-local-market .oma-results .oma -소매업체 .oma-소매업체.oma-지역 소매업체 .oma-카드 .oma-이미지 { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-local-tab .oma-market.oma-local-market .oma-results .oma -소매업체 .oma-소매업체.oma-지역 소매업체 .oma-카드 .oma-이미지 img { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-local-tab .oma-market.oma-local-market .oma-results .oma -소매업체 .oma-소매업체.oma-지역 소매업체 .oma-카드 .oma-정보 { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-local-tab .oma-market.oma-local-market .oma-results .oma -소매업체 .oma-소매업체.oma-지역 소매업체 .oma-카드 .oma-정보 주소 { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-local-tab .oma-market.oma-local-market .oma-results .oma -retailers .oma-retailer.oma-local-retailer .oma-card .oma-info 주소 범위 { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-local-tab .oma-market.oma-local-market .oma-results .oma -retailers .oma-retailer.oma-local-retailer .oma-card .oma-info 주소 span.oma-name{ }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-local-tab .oma-market.oma-local-market .oma-results .oma -소매업체 .oma-소매업체.oma-지역 소매업체 .oma-카드 .oma-정보 .oma-위치 { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-local-tab .oma-market.oma-local-market .oma-results .oma -소매업체 .oma-소매업체.oma-지역 소매업체 .oma-카드 .oma-정보 .oma-위치 .oma-message { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-local-tab .oma-market.oma-local-market .oma-results .oma -소매업체 .oma-소매업체.oma-지역 소매업체 .oma-카드 .oma-정보 .oma-위치 .oma-재고 { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-local-tab .oma-market.oma-local-market .oma-results .oma -소매업체 .oma-소매업체.oma-지역 소매업체 .oma-카드 .oma-정보 .oma-위치 .oma-재고 .oma-수준 { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-local-tab .oma-market.oma-local-market .oma-results .oma -소매업체 .oma-retailer.oma-local-retailer .oma-card .oma-info .oma-location .oma-stock .oma-level.oma-none { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-local-tab .oma-market.oma-local-market .oma-results .oma -소매업체 .oma-retailer.oma-local-retailer .oma-card .oma-info .oma-location .oma-stock .oma-level .oma-percent.oma-one { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-local-tab .oma-market.oma-local-market .oma-results .oma -소매업체 .oma-retailer.oma-local-retailer .oma-card .oma-info .oma-location .oma-stock .oma-level .oma-percent.oma-two { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-local-tab .oma-market.oma-local-market .oma-results .oma -소매업체 .oma-retailer.oma-local-retailer .oma-card .oma-info .oma-location .oma-stock .oma-level .oma-percent.oma-three { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-local-tab .oma-market.oma-local-market .oma-results .oma -소매업체 .oma-retailer.oma-local-retailer .oma-card .oma-info .oma-location .oma-stock .oma-level .oma-percent.oma-four { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-body .oma-markets .oma-tab.oma-local-tab .oma-market.oma-local-market .oma-results .oma -소매업체 .oma-소매업체.oma-지역 소매업체 .oma-카드 .oma-정보 .oma-위치 .oma-거리 { }
/* Omacro 모달 팝업 바닥글(국가 선택기, omacro 브랜딩) */
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-footer { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-footer .oma-region { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-footer .oma-region li { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-footer .oma-region li .oma-icon.oma-flag-icon { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-footer .oma-link { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-footer .oma-link .oma-logo { }
.oma-buynow.oma-modal .oma-dialog .oma-content .oma-footer .oma-link .oma-logo img { }
Related Articles
일반 딜러 로케이터에 대한 사용자 지정 브랜드 판매자 랜딩 페이지 추가
omacro의 General Dealer Locator 는 비제품 특정 딜러 목록 결과를 생성합니다. 이 기능을 사용하면 판매자를 표시하고 고객을 제품만 포함하는 판매자의 사용자 지정 브랜드 랜딩 페이지 또는 판매자 내의 브랜드 페이지(예: www. sellingsite.com/your-brand-here )로 보낼 수 있습니다. 판매자의 맞춤 웹사이트 URL을 추가하려면 아래 지침을 따르세요. 1) 로그인 후 판매자 관리 영역으로 이동합니다. ...온라인 딜러 결과에 사용자 지정 페이지 크기 추가
때때로 지금 구매 팝업의 온라인 부분에 표시되는 결과 수를 사용자 지정해야 할 수 있습니다. 예를 들어 페이지당 더 많거나 적은 판매자(또는 페이징 컨트롤이 없는 모든 판매자)를 표시하려는 경우입니다. 옵션 1: 지금 구매 스크립트 경로에서 전체적으로 페이지 크기 추가 사이트 전체에서 페이지 크기를 전체적으로 추가하려는 경우(지금 구매가 사용되는 모든 위치) 지금 구매 스크립트 경로에 다음 추가 매개변수를 사용하여 수행할 수 있습니다. ...멀티 스토어 오프라인 매장 재고 피드 지침
Omacro는 공급업체가 고객이 검색하는 품목의 재고가 있는 고객 근처의 온라인 딜러와 지역 매장을 모두 표시할 수 있는 기능을 지원합니다. 재고가 있는 지역 매장은 온라인 딜러 옆에 표시되며 지역 결과 영역에서 고객 영역에 해당 매장을 강조 표시합니다. 온라인 검색결과와 함께 표시되는 지역 검색결과의 예 재고 상태를 보여주는 로컬 결과의 예 온라인 매장 및 매장 위치에 오프라인 재고를 결과에 표시하려면 아래 단계를 따르세요(2개의 피드 섹션이 ...딜러 결과에 사용자 지정 규칙 추가
경우에 따라 특정 결과를 사용자 지정해야 할 수 있습니다. 예를 들어, 임대 제공업체 및/또는 서비스 센터만 표시하거나 소매점 위치(또는 조합)만 표시하려는 경우입니다. 이를 위해 몇 가지 다른 방법으로 이 선택적 매개변수를 구현할 수 있습니다. 옵션 1: 지금 구매 스크립트 경로에서 전체적으로 규칙 추가 사이트 전체(지금 구입이 사용되는 모든 위치)에 전역적으로 규칙을 추가하려는 경우 지금 구입 스크립트 경로에 다음 추가 매개변수를 사용하여 ...공급업체 지금 구매 구현 가이드
다음 문서에서는 지금 구매를 팝업으로 구현하거나 제품 기반 딜러 로케이터 또는 일반 딜러 로케이터 로 페이지 내에 삽입하는 다양한 방법에 대해 설명합니다. 지금 구매는 특정 시장(온라인 또는 지역)에 개방 되도록 구성하여 하나 이상의 특정 딜러 유형(렌탈 제공업체, 소매업체 또는 서비스 센터)을 표시하고 브랜드에 맞는 스타일을 포함하여 다양한 방식으로 표시할 수 있습니다 . 전제 조건 지금 구매를 지원하도록 네트워크 구성 지금 구매는 웹사이트와 ...