Colorbox без плагина и wordpress 3.5.1 галерея

Question

У меня проблема. Я хотел бы интегрировать эффект colorbox на тему wordpress, но без плагина. Так что у меня это:

<link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/css/colorbox.css" /> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/jquery-ui.min.js"></script> 

и это:

<script src="<?php echo get_template_directory_uri(); ?>/js/jquery.colorbox.js"> </script> 
<script> 
    jQuery(document).ready(function(){ 
$("a[href$='.jpg'],a[href$='.png'],a[href$='.gif']").colorbox({transition:"elastic", maxWidth:"80%", maxHeight:"80%", slideshow:"true"}); 
}); 

Таким образом, с тем, отдельные изображения работают отлично. Они открываются в окне colorbox. Но для галереи ничего. Итак, я добавляю

link="file" 

в галерее шорткодом, как это, например:

[gallery ids="54,53,58,59,66" link="file"] 

При этом изображение в галерее, открытой в ColorBox, хорошо. Но проблема в том, что каждое изображение открыто, как одно изображение, без разбивки на страницы (нет следующего изображения и предыдущего изображения)

Я тестирую сайт локально, поэтому у меня нет ссылки для вас. Wordpress 3.5.1 Нет плагина

Я не знаю, как решить проблему.

Если кто-то знает, где проблема, это было бы очень здорово.

Спасибо.

Answer 1

Вы должны добавить класс группы к изображениям, чтобы вы могли связать их вместе.

В этом примере «group_name» будет частью класса каждого изображения. И вместо того, чтобы использовать тип изображения я использовал тот же класс для вызова ColorBox

$(".group_name").colorbox({rel:"group_name", transition:"elastic", maxWidth:"80%", maxHeight:"80%", slideshow:"true"}); 

Answer 2

Спасибо за вашу помощь, Роберт,

Я, конечно, не очень хорошо, потому что я стараюсь свой метод, и я не могу приходите на работу.

Итак, я добавить свой код, и теперь у меня есть это:

 <script src="<?php echo get_template_directory_uri(); ?>/js/jquery.colorbox.js"></script> 
    <script> 
    jQuery(document).ready(function(){ 
$("a[href$='.jpg'],a[href$='.png'],a[href$='.gif']").colorbox({transition:"elastic", maxWidth:"80%", maxHeight:"80%", }); 
$(".group_name").colorbox({rel:"group_name", transition:"elastic", maxWidth:"80%", maxHeight:"80%", slideshow:"true"}); 
}); 
    </script> 

(я попробовал тоже с этим):

$("a.group_name").colorbox({rel:"grou..... 

и в HTML после издания, я ставлю это :

[gallery ids="54,53,58,59,66" class="group_name"] 

Я пытался ти это тоже:

[gallery ids="54,53,58,59,66" link="file" class="group_name"] 

Но ничего. Проблема такая же. Нет разбиения на страницы. Я действительно безнадежен :-)

[edit]: если я понимаю, что это не работает с [gallery].

С

<a href="http://localhost/.../......jpg" rel="group_name"><img src="http://localhost/.../....jpg" width="150" height="100" /></a> 
<a href="http://localhost/.../......jpg" rel="group_name"><img src="http://localhost/.../....jpg" width="150" height="100" /></a> 

Он отлично работает, спасибо.

Но нелегко. Возможно ли иметь colorbox автоматически в галереях WP 3.5.1 с классом, например, в

[gallery ...