How to make link open in the same tab - javascript

I have a button in menu section with link to pop-up.
I want to make so that it was opened in the same tab.
Here is the code of this button:
<button
class="btn btn-bg-no btn-border-green btn-color-green hvr hvr-buzz-out"
onclick="window.open('<?php echo esc_url( $menu_btn_url ); ?>', '_blank')">
<?php echo esc_html( $menu_btn ); ?>
</button>
I was trying to change '_blank' to '_self'. It changes the url, but my pop-up didn't appear. What can I do?

If you look at the docs for window.open() you'll see the second parameter is actually for naming the window if it doesn't reference an existing context, and webkit (chrome) has been having issues for the longest time with this.
You mention the button triggers a pop-up, but _self would basically treat it like you're clicking on a standard link, no? You may be better off using a standard link:
<a class="btn btn-bg-no btn-border-green btn-color-green hvr hvr-buzz-out" href="<?php echo esc_url( $menu_btn_url ); ?>">
<?php echo esc_html( $menu_btn ); ?>
</a>
If for some reason you want an onclick event, you'd probably be better suited using window.location.href instead of window.open:
<button class="btn btn-bg-no btn-border-green btn-color-green hvr hvr-buzz-out" onclick="window.location.href = '<?php echo esc_url( $menu_btn_url ); ?>'">
<?php echo esc_html( $menu_btn ); ?>
</button>
Also, a side note your SSL certificate on your website isn't working as it's issued to auditerra.ru and not intererka.auditerra.ru or *.auditerra.ru

Related

How to change a href when using multiple variables in PHP?

So I didn't found what I was looking for in last two days.
To be clear I have a table "tracks" in my database.
So I can show from "tracks" the "demo" field wich is an audio file "url"..
<?= $tracks['demo']; ?>
I have multiple url's but then I need to replace the a href
<a href="<?php echo $tracks['demo'];?>"
in a logical way.
In simple terms it's like I want to click on button 1 that loads
url 1 into this a href with the ID, title field from that track.
When you press button 2 you need to load another url and replace url 1 with url2.
I tried many ways including javascript but it won't work.
Problem now is that when I list 4 items it always loads the latest "URL" i have posted in my source code. :)
When I echo out <?php echo $tracks['demo]; ?> on all items I can see the correct url's so the functionality to replace the url is my issue.
* I basically want to load many mp3 url's in a player I made in the footer of my website. It works by hardcoding the urls in the url field but this is not what it should be... *
Code:
<?php while($tracks = mysqli_fetch_assoc($muziek)) : ?>
<div class="col-md-2 viny" id="muziek">
<h4><?= $tracks['title']; ?></h4>
<img src="<?= $tracks['img']; ?>"
alt=" <?= $tracks['title']; ?> />
<p class="artist">Artist: <?= $tracks['artist']; ?></p>
</div>
<?= $tracks['demo'] = $audiourl ; ?>
<button type="button" onclick="play">Play</button>
</div>
<?php endwhile; ?>
*THIS LOOPS PERFECT FOR ALL ITEMS TRACKS ARE LISTED PERFECT *
In my player I have
<a href="<?php echo $audiourl;?>" ><?= $tracks['artist']; ?></b> - <?= $tracks['title']; ?></a>
function play(){
I'm not good at JS... And this is my issue because it now loads the latest output from the php loop...
}
I don't know how you are replacing it but
Why not pass the audio in the function. Here like this
<button type="button" onclick="play(<?= $tracks['demo'] = $audiourl ; ?>)">Play</button>
assign a id to anchor tag
<a id="someId" href="<?php echo $audiourl;?>" ><?= $tracks['artist']; ?></b> - <?= $tracks['title']; ?></a>
and in the play function, you receive it like this
function play(audioUrl){
}
and change the href like this in the play function
If you are using jquery
$('#someId').attr("href", audioUrl);
sometimes the above does not works. Can't remember why but if that does not works try this
$('#someId').href = audioUrl
If you are using javascript
document.getElementById('abcd').href = audioUrl
So I tried many things but I had many issues with the player it's js file using the same id's and so on.
The new logic I tried out seems to work:
<form action="" method="POST">
<input type="submit" value="Play" name="Play">
</form>
<?php
if (isset($_POST["Play"]))
{
echo $tracks['demo'];
}else{
echo ' ';
}
?>
There is more going on but I tried to write it down as simple as this to show the logic. All Track url's are hidden and when the page loads there is an empty $audiourl by default loaded in the a href from my audioplayer. By clicking the button play I show the url in the source but not on the site.
Then the latest $audiourl variable changes to this value.

WordPress: how to open the_content() in a lightbox or new window?

I´m trying to open the_content (just pictures) in a lightbox.
I´d like a page like a Christmas-calendar so that you can see the posts (and the planned too) and if you click the published post, the image (the_content) should be shown in a shadowbox, lightbox or whatever, I think you´ll know what I mean. Right now my code looks like:
<header class="entry-header" rel="shadowbox" onclick="location.href='<?php the_permalink();?>';" style="cursor:pointer;">
<?php if ( ! post_password_required() && ! is_attachment() ) :
the_post_thumbnail();
endif; ?>
<?php if ( is_single() ) : ?>
<h1 class="entry-title"><?php the_title(); ?></h1>
<?php else : ?>
<?php endif; // is_single() ?>
<?php if ( comments_open() ) : ?>
<div class="kalender">
<p1> <?php the_field('nummer'); ?> </p1>
<br>
<p2><?php the_time('j. F Y'); ?> </p2>
<p3><?php the_title(); ?></p3>
</div>
<!-- .comments-link -->
<?php endif; // comments_open() ?>
</header>
I think the easiest way would be to handle the_content like a read_more link and just say onclick show in an shadowbox. But right now I just don't know how to. You can have a look here (right now just in Firefox or Safari, don't know why Chrome hates me:-))
Consider using the Fancybox plugin: http://fancybox.net/howto
Then include an anchor tag in each of your posts, like 'read more', with the content's unique ID:
<a class="fancybox" href="#content">Read More - This shows content of element who has id="content"</a>
Just ensure that each post's #content DIV has a unique ID, increment a variable in your loop and append it to read something along the lines of:
#content-01, content-02, etc.
Then just hide the content DIV's with CSS.
.fancybox { display: none; }
P.S. seems fine in Chrome 34.0.1847.131
Here's a useful pattern to pass server-side data to the client-side:
1. Use wp_localize_script to output a script fragment to the DOM.
2. Inside that script fragment, assign the value of the_content to a
JavaScript global string variable.
3. Use this JavaScript global from
inside your JavaScript to read the value of the_content

Two times same onclick function - only one works

I am desperate on this.
I create a list with an image and some description and other data.
The image and the description should be linked the same way.
The description link(onclick event) work fine:
<?php echo (string)$flat.'<br />'; ?>
But around the image it doesn't:
<a href="#" onclick="show_object('<?php echo $itemId.','.$identifier; ?>');return false;">
<img src="<?php echo (string)$image_url; ?>" class="list_image"></img>
</a>
Why? I do not understand, I tried several other ways, with including the onclick into the image, making a span out of the a.. Nothing works.
If I click on the image, I see in the javascript console that the request get started, but it does not load the page.
I do not understand since the two requests are exact same and immitedly behind another (inside a table)
please help!
I think you are missing some quotes:
<a href="#" onclick="show_object('<?php echo $itemId."','".$identifier; ?>');return false;">
<img src="<?php echo (string)$image_url; ?>" class="list_image"></img>
</a>
In your version, you call show_object('someitemid,someidentifier') but you want to call show_object('someitemid','someidentifier') as you do in your first <a>-tag.
How is that "exactly the same" ?
"show_object('<?php echo $itemId."','".$identifier; ?>'); return false;"
"show_object('<?php echo $itemId.','.$identifier; ?>');return false;"
I suggest you double check the quotes, or copypaste the working one into the other, then come back to us if it's not fixed :)

How to Defer Inline Scripts in OpenCart

If you've ever worked with OpenCart and you're a stickler for correct markup and optimization then you know already what a pain in the * it is.
There is inline js all through the templates since it relies on php variables in the templates to execute the js.
I'm currently working on an HTML5 fork of OC that moves all of this crap out of the templates and moves all the linked js files to the bottom of the page where they are supposed to be.
The problem is a have a client that wants this now, and it will take weeks to move all this scripting properly, so I'm trying to find a reliable way to defer the inline scripting so that it will only execute once all the files have loaded at the bottom.
I tried using defer on the script tag, but Chrome still executes it immediately as soon as it finds it, and I imagine most other browsers will too.
For example here's the carousel module:
<div id="carousel<?php echo $module; ?>" class="es-carousel-wrapper">
<div class="es-carousel">
<ul>
<?php foreach ($banners as $banner) { ?>
<li>
<a href="<?php echo $banner['link']; ?>">
<img src="<?php echo $banner['image']; ?>"
alt="<?php echo $banner['title']; ?>"
title="<?php echo $banner['title']; ?>" />
</a>
</li>
<?php } ?>
</ul>
</div>
</div>
<script type="text/javascript" defer>
$('#carousel<?php echo $module; ?>').elastislide({
speed : 450,
easing : '',
imageW : 290,
<?php if ($limit > 3): ?>
minItems : <?php echo $scroll; ?>
<?php else: ?>
minItems : 1
<?php endif ?>
});
$(window).triggerHandler('resize.elastislide');
</script>
As you can see it's much easier to keep it in the template page and just use the variables from the php, obviously the right way to do this is to implement the variables into js and call them later which is what I did for another client, but that took a long time to do.
Is there a reliable way to implement this using defer?
Thanks.
-Vince

jqModal not loading external links

I am trying to use jqModal to open some external links via AJAX using this code:
<h3><a class="username<?php echo $row['id']; ?>trigger"><?php echo get_user_meta( $user_id, 'first_name', $single );?> <?php echo get_user_meta( $user_id, 'last_name', $single );?></a></h3>
<script type="text/javascript">$(document).ready(function() {$('#username<?php echo $row['id']; ?>').jqm({ajax: 'http://www.google.ro/', trigger: 'a.username<?php echo $row['id']; ?>trigger'});}); </script>
<div class="jqmWindow" id="username<?php echo $row['id']; ?>">Please wait... <img src="inc/busy.gif" alt="loading" /></div>
The problem is that it doesn't load but if I put an internal link it works. Someone can help me with this?
What you are trying to do is cross domain Ajax. Jqmodal and any other plugins will not be able to do that.
Jqmodal has an iframe method to pull in an external website. See point 7. On the jqmodal page.
You will need to use an API if the external site has one, or use server side code to 'scrape'

Categories