HTML과 CSS를 사용하여 Pinterest 위젯의 배경을 변경하십시오.

Question

나는 pinterest의 위젯을 사용하여 설명에서 다른 배경과 텍스트 색상을 사용하는 데 수 시간 동안 노력했습니다. 내 페이지

http://www.nicholasboydcrutchley.com/short-stories/woman-and-wolf

나는 그것이로드의 클래스를 변경 알고 있습니다.

누구든지 CSS에 넣을 코드와 위치를 알고 있습니까? 또한 어떤 html을 사용할 것입니다. 또는 위젯의 높이를 고쳐서 그림 만 남길 수 있습니까?

<a data-pin-do="embedPin" href="http://www.pinterest.com/pin/386535580491200669/"></a> 
<!-- Please call pinit.js only once per page --> 
<script type="text/javascript" async src="//assets.pinterest.com/js/pinit.js"></script> 

나는 심지어 매개 변수를 고정, 핀 버튼을 사용하여 시도했지만, 나는

<a href="//pinterest.com/pin/create/button/?media=http://www.nicholasboydcrutchley.com/uploads/1/5/9/8/15988944/8246087_orig.jpg&amp;description=Woman and Wolf by @Nicholas Boyd Crutchley ∞ #Read #shortstory www.nicholasboydcrutchley.com/ww ∞ #Art @leafbreeze7&amp;url=http:www.nicholasboydcrutchley.com/short-stories/woman-and-wolf"><img src="//assets.pinterest.com/images/pidgets/pin_it_button.png"></a> 

의 경우에서와 같이 .... 핀의 설명에 #을 포함하는 방법을 아주 확실하지 오전 # 설명에 허용하는 방법을 알면 좋을 것입니다.

전체 위젯에 대한 당신의 친절한 도움

Answer 1

주셔서 감사합니다 :

1. 이 클래스에게 span에서 PIN_1404822151302_embed_pin PIN_1404822151302_fancy를 제거하고 자신의 클래스를 추가 할 수 있습니다.
2. 보관할 관련 CSS를 복사하여 붙여 넣으십시오. 스팬

CSS는 (제거 어떤 !important)

.myPinWidget { 
    /*styles I want to keep from old class CSS */ 
    /*custom styles*/ 
} 

또는 실제 버튼

:

1. 클래스 PIN_1404822151302_repin를 제거하고 자신의 클래스를 추가
2. 경찰 y를 클릭하고 보관하려는 관련 CSS를 붙여 넣습니다. 현재 버튼에 대한

CSS 새로운 버튼

span.PIN_1404822151302_embed_pin a.PIN_1404822151302_embed_pin_link i.PIN_1404822151302_repin { 
left: 12px!important; 
top: 12px!important; 
position: absolute!important; 
height: 20px!important; 
width: 40px!important; 
background-size: 40px 60px!important; 
background: transparent url(http://passets.pinterest.com/images/pidgets/pinit_bg_en_rect_red_20_1.png); 
} 

CSS

.myPinButton { 
    /*styles I want to keep from old class CSS */ 
    /*custom styles*/ 
} 

HTML

<i class="myPinButton" data-pin-id="386535580491200669" data-pin-log="embed_pin_repin" data-pin-href="//www.pinterest.com/pin/386535580491200669/repin/x/"></i>