Flex slider 2 pomoc

Programiranje
1

Pozdrav :slight_smile:

Trebam pomoc oko Flex slidera tacnije njegove instalacije.Radim citavo jutro i totalno sam zbunjen xD.Znaci zelim da napravim nesto ovako uz modifikaciju css-a FlexSlider 2 al’ ne znam sta treba sve da includam.
Ovako sam ja uradio:
Ovo sam u head sam inc. ovaj file
jquery.flexslider.js

Ovo je kao neki ispis (u body)

<div class="flexslider">
  <ul class="slides">
  <?php $recent = new WP_Query("cat=&showposts=12"); while($recent->have_posts()) : $recent->the_post();?>
    <li>
      <img src="<?php $values = get_post_custom_values("thumb"); echo $values[0]; ?>" />
    </li>
	<?php endwhile; ?>
  </ul>
  
</div>

I ovo u body

I zabroavio sam reci i flexslider.css sam inc. :slight_smile: i jquery je includan
Sta ne valja ? :slight_smile: inace radi se o WP stranici (:

2

niko ? :slight_smile:

3

Teško ti mogu pomoći samo iz koda, trebao bih vidjeti live stranicu, no ovo je definitivno greška:

<script>
$(window).load(function() {
  $('.flexslider').flexslider({
    animation: "slide",
    animationLoop: false,
    itemWidth: 120,
    itemMargin: 5
  });
});
</script>

U WordPressu treba biti ovako:

<script>
jQuery(window).load(function() {
  jQuery('.flexslider').flexslider({
    animation: "slide",
    animationLoop: false,
    itemWidth: 120,
    itemMargin: 5
  });
});
</script>

a ako baš želiš koristiti $, onda ga pošalješ kao argument, ovako:

<script>
jQuery(window).load(function( $ ) {
  $('.flexslider').flexslider({
    animation: "slide",
    animationLoop: false,
    itemWidth: 120,
    itemMargin: 5
  });
});
</script>
4

Apazanjin je u pravu, jQuery u wordpressu radi u no-conflict, stoga moras koristiti jQuery umjesto $

5

Zahvaljujem :slight_smile:

No nesto nece mislim opet je isto :slight_smile: A da li sam sve potrebne fajlove includao ? Jer ima jos masa nekih JS fajlova koji dodju uz slider :slight_smile:

6

Kad kažeš da si includao jQuery, na što točno misliš?

Vjerojatno si stvorio problem sa includanjem tog jQuery-a i moj savjet bi bio da skripte ne stavljaš u head, već koristiš:
Function Reference/wp enqueue script « WordPress Codex

Npr. dodaš ovo u functions.php file svoje teme:

To će pozvati skriptu iz wp-content/themes/tvojatema/js/ foldera pod imenom jquery.flexslider.js
Ovaj <span class="syntaxdefault"></span><span class="syntaxkeyword">array(&nbsp;</span><span class="syntaxstring">'jquery'&nbsp;</span><span class="syntaxkeyword">)&nbsp;</span><span class="syntaxdefault"></span> kaže funkciji da prije tog file-a, ako već nije, pozove jQuery skriptu.

Istu stvar bi trebao napraviti i za savsvoj custom js kod.

P.S Definitivno pogledaj šta ti konzola od browsera izbacuje.

7

Evo kako to izgleda Screenshot by Lightshot taj bijeli prostor ispod navigacije treba biti slider :slight_smile: a sada cu pokusati ovo tvoje

8

Evo sta konzola kaze:
Screenshot by Lightshot

9

Kaže jQuery not defined, to znači da svoj custom js kod pišeš prije nego si includao jQuery.

Napravi zasebnu datoteku za svoj js kod, flexslider skriptu samo registriraj (googlaj wp_register_script) te zatim na svoj custom js kod postavi dependency array( ‘jquery’, ‘my-flexslider’ );

10

Ok :slight_smile:
Samo imam jedno pitanje.Dodao sam ovo u functions.php
[php]function my_flexslider() {
wp_enqueue_script(
‘my-flexslider’,
get_template_directory_uri() . ‘/js/jquery.flexslider.js’,
array( ‘jquery’ )
);
}

add_action( ‘wp_enqueue_scripts’, ‘my_flexslider’ ); [/php]
Posto se slider nalazi samo na index.php jel ga trebam nekako pozvati tamo u index.php jer se ne prikazuje nigdje kada pogledam page source :slight_smile:

11

Ako se taj slider koristi samo na početnoj stranici, onda bi to ovako išlo:

Sad još napraviš custom.js datoteku unutar js foldera i unutra zalijepiš onaj poziv za flexslider koji si prije stavljao u head tag

12

@apazinjan hvala :smiley: to je to :smiley:

13

Np :wink: