코드 좀 확인 부탁드립니다

안녕하세요

소셜 아이콘을 footer 에 삽입 중입니다.

제가 코드를 잘 볼 줄을 몰라 이렇게 질문 드리게 되었습니다.

[그림 1]

먼저 위 이미지 중 위쪽의 페이스북 아이콘에 마우스를 갖다 대니, 아이콘 위에 Facebook 이라는 설명이 나옵니다.

[그림 2]

그리고 바로 위 이미지 중 아래쪽 페이스북 아이콘에 마우스를 갖다 대니, 아이콘 위에 Facebook 이라는 설명이 나옵니다만 사각형 안에 설명이 나옵니다.

첫번째 이미지처럼 박스 안이 아닌 그냥 바탕없이 글자설명만 나오게 하고 싶습니다.

[그림 1]의 코드소스를 그대로 사용하면 되지...하시겠지만....

RSS 아이콘을 없애고 싶은데 테마에서 제공해준 코드가

[theshopier_social item="%5B%7B%22icon%22%3A%22fa%20fa-facebook-square%22%2C%22title%22%3A%22Facebook%22%2C%22link%22%3A%22%23%22%2C%22color%22%3A%22%23ffffff%22%7D%2C%7B%22icon%22%3A%22fa%20fa-twitter-square%22%2C%22title%22%3A%22Twitter%22%2C%22link%22%3A%22%23%22%2C%22color%22%3A%22%23ffffff%22%7D%2C%7B%22icon%22%3A%22fa%20fa-instagram%22%2C%22title%22%3A%22Instagram%22%2C%22link%22%3A%22%23%22%2C%22color%22%3A%22%23ffffff%22%7D%2C%7B%22icon%22%3A%22fa%20fa-google-plus-square%22%2C%22title%22%3A%22Google%20plus%22%2C%22link%22%3A%22%23%22%2C%22color%22%3A%22%23ffffff%22%7D%2C%7B%22icon%22%3A%22fa%20fa-rss-square%22%2C%22title%22%3A%22Rss%22%2C%22link%22%3A%22%23%22%2C%22color%22%3A%22%23ffffff%22%7D%5D" ic_size="fa-3x"]

 

위와 같아서 해석 불가에, 수정 불가입니다..ㅠㅠ

뒷부분의 ic_size="fa-3x"] 앞의 " 바로 전의 D부터 한글자씩 지우고 저장해서 페이지 새로고침 한뒤 확인하는 작업을 무한반복 했습니다만, 한글자만 지워도 위 5개의 아이콘 전부가 사라져버리더라구요..ㅠㅠ

그래서 구글링을 통해 아이콘을 삽입할 수 있는 방법을 어떻게든 찾아서 아래와 같이 넣어봤습니다.

<p>
<a style="color: #ffffff;" title="Facebook" href="#">
<i class="fa fa-facebook-square fa-3x"></i>
</a>&nbsp;&nbsp;

<a style="color: #ffffff;" title="Twitter" href="#">
<i class="fa fa-twitter-square fa-3x"></i>
</a>&nbsp;&nbsp;

<a style="color: #ffffff;" title="Instagram" href="#">
<i class="fa fa-instagram fa-3x"></i>
</a>&nbsp;&nbsp;

<a style="color: #ffffff;" title="Google Plus" href="#">
<i class="fa fa-google-plus-square fa-3x"></i>
</a>
</p>

이렇게 넣으니 아래부분의 4개의 아이콘이 삽입이 되었는데, 마우스오버 했을때 글자만 나오게 하는 방법을 모르겠습니다.

바로 위의 코드만 같아도 어떻게든 알아는 볼 수 있을 거 같아서 바로 위의 코드를 사용하고 싶은데요.

마우스 오버 했을때 박스없이 설명만 나오게 하려면 코드를 어떻게 바꿔야 하는지 아시는 분 가르쳐 주시길 부탁드립니다.

감사합니다

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