소셜 공유 버튼 문의드립니다

안녕하세요.

소셜 공유 버튼 By 코스모스팜

플러그인을 사용중인데 이게 AMP모드로 사이트 접속시 최적화가 안되더라구요.

아래에 캡쳐해봤습니다.

https://www.dropbox.com/s/k0k10eymso60btc/2017-12-02%2006.17.19.png?dl=0

방법이 있을까요?

워드프레스 에러 기술지원 서비스 전문가에게 맡기세요
좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기
  • 안녕하세요~^^

    WP Fastest Cache 플러그인에서 추가한 CSS 속성 문제로 보입니다.

    워드프레스 관리자 -> 외모 -> 사용자 정의하기 -> CSS 입력 필드에

    아래의 코드를 추가하고 확인해보시겠어요?

    @media only screen and (max-width: 700px){
    	.continue-reading-content.close:after { content: normal; }
    }

    고맙습니다.

  • 안녕하세요~^^

    이미지는 잘렸는지 보이지 않는군요.

    AMP모드는 구글에서 제공하는 엑셀러레이티드 모바일 페이지(AMP, Accelerated Mobile Pages) 말씀이신지요?

    실제로 확인할 수 있는 AMP모드 주소를 알려주시겠어요?

    레이아웃 문제는 실제로 확인해봐야만 어떻게든 도움을 드릴 수 있거든요.

    고맙습니다.

  • 안녕하세요.

    저희 쪽에서 확인해본 페이지는 아래의 페이지였습니다.

    https://weloveadidas.com/2017/12/01/gary-aspden-talks-adidas-spezial-fw17-by-sneakers-magazine/

     

    weloveadidas.com/amp

    위 페이지로 확인해보니 소셜 공유 버튼의 CSS가 전혀 적용되어있지 않는군요.

    CSS가 적용되지 않는 원인을 찾으셔야 할 듯합니다.

     

    임시방편으로

    워드프레스 관리자 -> 외모 -> 사용자 정의하기 -> CSS 입력 필드에

    아래의 코드를 추가해보시겠어요?

    .cosmosfarm-share-buttons-default.cosmosfarm-align-left { text-align: left; }
    .cosmosfarm-share-buttons-default .cosmosfarm-share-button-title { display: inline-block; margin: 0 0 5px 0; vertical-align: middle; }
    .cosmosfarm-share-buttons-default .cosmosfarm-share-button { margin: 0 0 5px 0; padding: 0; font-size: 11px; font-weight: normal; line-height: 11px; text-align: left; border: 0; border-radius: 0; letter-spacing: normal; cursor: pointer; vertical-align: middle; text-shadow: none; box-shadow: none; }
    .cosmosfarm-share-buttons img { display: inline; margin: 0; padding: 0; width: 32px !important; height: 32px !important; vertical-align: middle; max-width: 100%; border: 0; }

    고맙습니다.

  • 어헉. 그렇군요.

    weloveadidas.com/amp

    로 접속하신게 맞나요? ㅎㅎㅎ

     

    일단, 저는 아이폰 시리즈(6, 7플러스), 넥서스6p 를 사용했습니다. ㅠㅠ

    동일한데요. ㅎㅎ

     

    어떤 모바일 기기 사용하셨나요? ㅎㅎ

  • 안녕하세요~^^

    실제 모바일 기기에서도 접속해서 확인해봤습니다.

    올려주신 이미지와는 다르게 정상적으로 표시되고 있습니다.

    크롬 브라우저의 개발자 도구에 있는 Toggle device toolbar로도 확인해봤지만 정상적으로 표시되고 있었습니다.

    어떤 모바일 기기를 사용하고 계신가요?

    다른 기기로도 테스트해보시겠어요?

    고맙습니다.

  • 답변 감사합니다.

    pc 에서 봤을 때는 정상적인데

    모바일에서는 캡쳐본 처럼 크게 나오더라구요.

    모든 포스팅 페이지 동일하게 그렇습니다. ㅎㅎ

    모바일에서 보신거에요? ㅎㅎ

  • 안녕하세요~^^

    위에 안내드린 코드는

    모바일에서 소셜 공유 버튼이 작동하지 않는 현상이 있어서 알려드렸습니다.

     

    댓글로 남겨주신 아래의 페이지에서 소셜 공유 버튼의 크기가 크게 나오시는지요?

    https://weloveadidas.com/2017/12/01/gary-aspden-talks-adidas-spezial-fw17-by-sneakers-magazine/

    저희 쪽에서 확인해보니 버튼의 크기에는 문제가 없어 보입니다.

    혹시 다른 페이지라면 페이지 주소 알려주시겠어요?

    고맙습니다.

  • 으응음. 잘 안되네요 ㅠㅠ

    CSS 입력하는 부부은 거의 다 넣었는데 모바일에서는 그대로 크게 나옵니다.

    https://www.dropbox.com/s/uh8oatjeofhld9p/2017-12-05%2016.53.56.jpg?dl=0

  • https://weloveadidas.com/2017/12/01/gary-aspden-talks-adidas-spezial-fw17-by-sneakers-magazine/

    입니다.

    핸드폰에서 봤을 때 그렇습니다.

  • 크흑, 정말 많이 알려주셨는데

    테마와 플러그인 덕분에 css코드가 꼬였나 봅니다.

    계속 신경써주셔서 감사합니다. ㅠㅠ

     

    일단, amp 플러그인을 삭제했습니다 ㅋㅋ

워드프레스 에러 기술지원 서비스 전문가에게 맡기세요