Open Fancybox on specific page

Asked

Viewed 190 times

0

I have a fancybox banner that opens on all pages. However, I want it to open only when the user is at the home of the site.

I’m calling the javascript below in a. php file that calls the script on every page of the site. So, I just put it in the home.php file that is only for the home of the site. Because, I don’t want Fancybox to not appear on other pages. Only at Home.

However, fancybox is not being called.

<script type="text/javascript">
     $(document).ready(function() {
         $.fancybox.open({
           src : '/assets/images/banner-aviso.png',
           type : 'image'
         });
     });
</script>
<a class="hidden-link pop-up" href="/assets/images/banner-aviso.png">&nbsp;</a>

On the console, the following warning appears:

"Uncaught Referenceerror: $ is not defined at (index):36 (Anonymous) @ (index):36"

In which case it would be "$(document).ready(function() {"

Is the JS not being called on the home page? How I would do a PHP check to see which page URL?

php jquery

  • jQuery is not being loaded.

  • How I would do a PHP check to see the URL?

  • But then how would I make him open the Fancybox after the check?

  • Yes. There are two files: home.php and index.php - index.php goes to all pages.

  • @Felipestoker the URL has the format http://site.com/home or http://site.com/home.php or http://site.com/?pag=home?

2 answers

1

You can check which page you are using on $_SERVER['REQUEST_URI'] and checking with strpos() if the string /home is in the current URL.

It is also important to check if jQuery is being loaded on the page. Ideally, you should upload it to <head>, before all the plugins. The basic structure would be like this:

<html>
<head>
    <script src="jquery.js"></script>
</head>
<body>

<?php
if (strpos($_SERVER['REQUEST_URI'], '/home')){
    // está na home. Aqui você carrega os scripts que quiser apenas na home
?>
<script src="caminho_do_fancybox/fancybox.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $.fancybox.open({
       src : '/assets/images/banner-aviso.png',
       type : 'image'
    });
});
</script>
<a class="hidden-link pop-up" href="/assets/images/banner-aviso.png">&nbsp;</a>
<?php
}
?>    

</body>
</html>

  • And how I would put that script, in case?

  • So? https://jsfiddle.net/kdo7ksaq/

  • @Felipestoker See that I put the 'REQUEST_URI' in single quotes.

  • Actually the URL is /home. I think I can put this instead of "home.php"?

  • @Felipestoker yes, put "/home" instead of "home.php"...

  • Strange that I did all this. And is not calling the Fancybox.

  • @Felipestoker Load Fancybox script in the same place. I will update the answer.

  • @Felipestoker See if you are returning console error.

Show 3 more comments

0

Can use parse_url to check the $_SERVER['REQUEST_URI']

Note 1: the mistake:

"Uncaught Referenceerror: $ is not defined at (index):36 (Anonymous) @ (index):36"

Indicates that jQuery has not been loaded on your page, it is necessary to put it before the script you want to run, something like:

<html>
<head>
    <script src="pasta/jquery.js"></script>
    <script src="pasta/fancybox.js"></script>
</head>
<body>
    ...
    <?php if (<condição>): ?>

    <script type="text/javascript">
    $(document).ready(function() {
        $.fancybox.open({
           src : '/assets/images/banner-aviso.png',
           type : 'image'
        });
    });
    </script>
    <a class="hidden-link pop-up" href="/assets/images/banner-aviso.png">&nbsp;</a>

    <?php endif; ?>
    ...
</body>
</html>

Note 2: the REQUEST_URI you must have the apostrophes (single quotes), because if you do $_SERVER[REQUEST_URI] the PHP will first look for a constant call REQUEST_URI, which does not exist, so will issue a notice thus:

Notice: Use of Undefined Constant REQUEST_URI - assumed 'REQUEST_URI'

The assumed 'REQUEST_URI' indicates that PHP for not finding the constant has cast a string, however note that although $_SERVER[REQUEST_URI] work, but perhaps some additional script generate the constant REQUEST_URI with some value, so this will fail for sure.

Note also that strpos() can return 0 or false, in the case of @DVD script no, still if you are accessing a page with the similar name foobarhome.php the strpos will also enter the IF, then the ideal to avoid problems is to use the parse_url or else use preg_match, follows examples:

Using parse_url

The parse_url($url, PHP_URL_PATH) will extract only the path, if in the home the value /home

<?php if (parse_url($_SERVER['REQUEST_URI'], PHP_URL_PATH) === '/home'): ?>

<script type="text/javascript">
     $(document).ready(function() {
         $.fancybox.open({
           src : '/assets/images/banner-aviso.png',
           type : 'image'
         });
     });
</script>
<a class="hidden-link pop-up" href="/assets/images/banner-aviso.png">&nbsp;</a>

<?php endif; ?>

If the home you refer to is index.php, then do so:

<?php if (parse_url($_SERVER['REQUEST_URI'], PHP_URL_PATH) === '/'): ?>
...

If it is a page range, you can use an array:

Note: the ltrim take the bar from the top

<?php
$pathAtual = ltrim(parse_url($_SERVER['REQUEST_URI'], PHP_URL_PATH), '/');

$permitidos = array( 'home', 'contato', 'admin/foo' ); //Adicione as páginas permitidas aqui
?>

<?php if (in_array($pathAtual, $permitidos)): ?>
...

With preg_match (regex)

In this case I used (regular expressions), with it you can create a range of pages within the regex, for example this regex will check if it is the home or the index #/(index|home)$#, example:

<?php if (preg_match('#/(index|home)$#', $_SERVER['REQUEST_URI'])): ?>

<script type="text/javascript">
     $(document).ready(function() {
         $.fancybox.open({
           src : '/assets/images/banner-aviso.png',
           type : 'image'
         });
     });
</script>
<a class="hidden-link pop-up" href="/assets/images/banner-aviso.png">&nbsp;</a>

<?php endif; ?>

Browser other questions tagged php jquery

You are not signed in. Login or sign up in order to post.