source

타임라인이 아닌 트위터 프로파일 포함

myloves 2023. 4. 3. 21:52

타임라인이 아닌 트위터 프로파일 포함

Twitter 사용자 프로필을 포함하기 위한 해결책을 찾고 있었지만, 지금까지 아무 것도 나오지 않았습니다.제가 찾고 있는 것은 twitter.com에서 사용자 이름을 클릭했을 때 Twitter가 멋진 프로필 개요를 보여주는 것과 비슷합니다.내가 무슨 말을 하는지 알 수 있도록 내 프로필을 캡으로 찍었어.

여기에 이미지 설명 입력

사용자 타임라인 등은 필요 없습니다만, 유저 정보나 커버 사진의 배경, 인물을 팔로우 하는 링크가 있으면 좋겠습니다.트위터 내장 코드 빌더를 살펴봤지만 정말 맞는 것은 없는 것 같아요.Wordpress를 사용하고 있기 때문에 플러그인 솔루션을 사용할 수 있지만, 코드 삽입만 해도 괜찮습니다.

현재 프로파일 요약에 대해 알고 있는 임베드 기능은 없지만, 두 가지 방법으로 api를 호출하여 Twitter에서 프로파일 정보를 얻을 수 있습니다.

  1. /users/show, 한 번에 한 번만 사용 가능
  2. 한 번에 최대 100명의 사용자: /users/lookup

그런 다음 반환된 json을 트위터 형식이나 원하는 다른 스타일에 맞게 스타일링할 수 있습니다.

실제로 내장되어 있지는 않지만, 이 기능은 고객님께도 도움이 될 수 있습니다.https://dev.twitter.com/web/intents#user-intent

여기 버튼 구현이 있습니다. 이것은 프로필 사진과 배경 사진을 추가하기 위해 약간의 작업이 필요합니다.

아이콘 SVG 코드:

  <symbol id="twitter" viewBox="0 0 512 512"><path d="M459.37 151.716c.325 4.548.325 9.097.325 13.645 0 138.72-105.583 298.558-298.558 298.558-59.452 0-114.68-17.219-161.137-47.106 8.447.974 16.568 1.299 25.34 1.299 49.055 0 94.213-16.568 130.274-44.832-46.132-.975-84.792-31.188-98.112-72.772 6.498.974 12.995 1.624 19.818 1.624 9.421 0 18.843-1.3 27.614-3.573-48.081-9.747-84.143-51.98-84.143-102.985v-1.299c13.969 7.797 30.214 12.67 47.431 13.319-28.264-18.843-46.781-51.005-46.781-87.391 0-19.492 5.197-37.36 14.294-52.954 51.655 63.675 129.3 105.258 216.365 109.807-1.624-7.797-2.599-15.918-2.599-24.04 0-57.828 46.782-104.934 104.934-104.934 30.213 0 57.502 12.67 76.67 33.137 23.715-4.548 46.456-13.32 66.599-25.34-7.798 24.366-24.366 44.833-46.132 57.827 21.117-2.273 41.584-8.122 60.426-16.243-14.292 20.791-32.161 39.308-52.628 54.253z" /></symbol>

SAS/CSS:

.twitter a  
  font-family: "Roboto", "Noto Sans", "Open Sans", "sans-serif"
  display: inline-flex
  color: #fff
  border-radius: 5px
  background: #1b95e0
  padding: .4em .8em
  text-decoration: none
  font-weight: bold
  text-align: left

HTML:

<div class="twitter" style="height: 35px; width: 240px;"><a target="_blank" rel="noopener noreferrer" href="https://twitter.com/LinuxHacksOrg">
<svg height="20px" width="20px" style="margin-right: 5px; fill: #fff;">
<use xlink:href="/assets/imgs/res/icons-full.svg#twitter"></use></svg>
Follow us @LinuxHacksOrg</a></div>

<style>
.twitter a {
  font-family: "Roboto", "Noto Sans", "Open Sans", "sans-serif";
  display: inline-flex;
  color: #fff;
  border-radius: 5px;
  background: #1b95e0;
  padding: .4em .8em;
  text-decoration: none;
  font-weight: bold;
  text-align: left;
}
</style>

<div class="twitter" style="height: 35px; width: 300px;"><a target="_blank" rel="noopener noreferrer" href="https://twitter.com/LinuxHacksOrg">
<svg height="20px" width="20px" style="margin-right: 5px; fill: #fff;" viewBox="0 0 512 512" preserveAspectRatio="none">
<path d="M459.37 151.716c.325 4.548.325 9.097.325 13.645 0 138.72-105.583 298.558-298.558 298.558-59.452 0-114.68-17.219-161.137-47.106 8.447.974 16.568 1.299 25.34 1.299 49.055 0 94.213-16.568 130.274-44.832-46.132-.975-84.792-31.188-98.112-72.772 6.498.974 12.995 1.624 19.818 1.624 9.421 0 18.843-1.3 27.614-3.573-48.081-9.747-84.143-51.98-84.143-102.985v-1.299c13.969 7.797 30.214 12.67 47.431 13.319-28.264-18.843-46.781-51.005-46.781-87.391 0-19.492 5.197-37.36 14.294-52.954 51.655 63.675 129.3 105.258 216.365 109.807-1.624-7.797-2.599-15.918-2.599-24.04 0-57.828 46.782-104.934 104.934-104.934 30.213 0 57.502 12.67 76.67 33.137 23.715-4.548 46.456-13.32 66.599-25.34-7.798 24.366-24.366 44.833-46.132 57.827 21.117-2.273 41.584-8.122 60.426-16.243-14.292 20.791-32.161 39.308-52.628 54.253z" />
</svg>
Follow us @LinuxHacksOrg</a></div>

언급URL : https://stackoverflow.com/questions/20404844/embed-a-twitter-profile-not-a-timeline