Управление стандартными элементами управления iframe Tumblr - PullRequest
Новая
       19

Управление стандартными элементами управления iframe Tumblr

1 голос
/ 10 февраля 2012

Есть ли способ манипулировать элементами управления Tumblr?Они довольно уродливые и серые.Я хочу знать, есть ли способ добавить iframe#tumblr_controls {display:none;} в мой CSS и воссоздать все элементы управления с той же функциональностью, но с другим видом. Tumblr control (iFrame)

Ответы [ 2 ]

2 голосов
/ 15 февраля 2012

Да, довольно просто заменить все функции.Как вы предлагали, вы можете скрыть настройки Tumblr по умолчанию: 

#tumblr_controls {display:none;}

На индексных страницах вам нужны Dashboard, Follow и Email.Вы не можете определить, нужно ли вам Отписаться, но всегда показывать Follow не должно быть слишком плохо.

URL панели: 

http://www.tumblr.com/dashboard

Follow URL: 

http://www.tumblr.com/follow/<blogname>

Адрес электронной почты: 

http://www.tumblr.com/send/<blogname>?redirect_to=http%3A%2F%2F<blogname>.tumblr.com%2F

На страницах с постоянными ссылками вам также нужны Reblog и Like.Это немного сложнее, но у меня есть пример: http://like -button.tumblr.com /

В Reblog используется недокументированная переменная, {ReblogURL}.Вы просто делаете его href ссылки: 

<a href="{ReblogURL}">reblog</a>

Чтобы добавить функциональность Like, вы используете следующий URL и задаете его как атрибут src невидимого <iframe>: 

http://www.tumblr.com/<command>/<oauthId>?id=<postId>
  • <command>: like или unlike
  • <oauthId>: последние восемь символов {ReblogURL}
  • <postId>: {PostID}

Пример: 

http://www.tumblr.com/like/fGKvAJgQ?id=16664837215

Вам необходимо поместить обе переменные, {ReblogURL} и {PostID}, в ваш блок {block:Posts}.Затем используйте скрипт для построения URL и установите src. 

$( document ).on( 'click', '.like', function ( event ) {

event.preventDefault();

var command = $( this ).hasClass( 'liked' ) ? 'unlike' : 'like',
    post = $( this ).closest( '.post' ),
    oauth = post.find( '.reblog' ).attr( 'href' ).slice( -8 ),
    id = post.attr( 'id' ),
    likeUrl = 'http://www.tumblr.com/' + command + '/' + oauth + '?id=' + id;

$( '#like-it' ).attr( 'src', likeUrl );
$( this ).toggleClass( 'liked' );

} );

{block:Posts}
<article id="{PostID}">
<a href="{ReblogURL}" class="reblog">reblog</a>
<a href="#" class="like">like</a>
</article>
{/block:Posts}

<iframe id="like-it"></iframe>

#like-it {
    display: none;
}

.liked, .like:hover {
    color: red !important;
}
1 голос
/ 17 марта 2014

Теперь все по-другому.Просто добавьте 

#iframe_controls { display:none; }

к CSS (внутри тега «Редактировать HTML»).

...