How to properly use fancybox in wordpress?

Question

PHP

Hello! Can someone tell me, using the alethemes framework, post-type gallery, how to properly display an image gallery so that fancybox works when you click on an image? fancybox itself connected css and js, set the fancybox class to the link, in script.js I wrote that fancybox would work when the link was clicked, but I don’t know how to correctly write the value in the href parameter so that the link to the large image is generated correctly. It turns out that if I leave the parameter empty, then everything works and the picture opens in a modal window, but when minimized, it disappears from the page.

<div class="gallery_items">
                    <?php $args = array(
                        'post_type' => 'attachment',
                        'numberposts' => -1,
                        'post_status' => null,
                        'order'				=> 'ASC',
                        'orderby'			=> 'menu_order ID',
                        'meta_query'		=> array(
                            array(
                                'key'		=> '_ale_hide_from_gallery',
                                'value'		=> 0,
                                'type'		=> 'DECIMAL',
                            ),
                        ),
                        'post_parent' => $post->ID
                    );
                    $attachments = get_posts( $args );
                    if ( $attachments ) {
                        foreach ( $attachments as $attachment ) { ?>
                            <div class="single">
                                <a class="fancybox" href=""><?php echo wp_get_attachment_image( $attachment->ID, 'gallery-big' ); ?></a>
                            </div>
                        <?php }
                    } ?>
                </div>

Answer 1

Everything was solved by adding the following structure to the href: <?php echo wp_get_attachment_url( $attachment->ID ); ?>