Social Sharing / Render 'like' button after ajax call on tumblr - php

For Facebook and for Google i found this solution..
<script type="text/javascript">
$(document).ajaxComplete(function(){
try{
FB.XFBML.parse();
gapi.plusone.go();
}catch(ex){}
});
</script>
but not for tumblr. Does anybody know if there is any solution?
Tubmlr-post-button is implemented like this:
<a class="tumblr-share-button" data-href="http://www.xy.ch/news_entries/<? php echo "{$row['title']}.html" ?>" data-content="http://www.xy.ch/news_entries/<?php echo "{$row['title']}.html" ?>" data-color="blue" data-notes="right" href="https://embed.tumblr.com/share"></a>
Thanks
M

I had to find another solution (because i have another use case) and worked out this:
<img src='http://www.mywebsite.com/share_list.png' data-pin-no-hover="true" class="share_buttons_img" usemap='#share_buttons' />
<map name='share_buttons'>
<area shape='circle' coords='78,21,13,80' href="#" title="Share on Facebook" onclick="popUp=window.open('https://www.facebook.com/sharer/sharer.php?u=www.mywebsite.com/news/<?php echo "{$row['image_title']}.html" ?>','popupwindow', 'scrollbars=yes,width=500,height=400');popUp.focus();return false;" >
<area shape='circle' coords='116,21,13,80' href="#" title="Share on Tumblr" onclick="popUp=window.open('http://tumblr.com/widgets/share/tool?canonicalUrl=http://www.mywebsite.com/news/<?php echo "{$row['image_title']}.html" ?>','popupwindow', 'scrollbars=yes,width=500,height=400');popUp.focus();return false;" >
<area shape='circle' coords='153,21,13,80' href="#" title="Share on Google+" onclick="popUp=window.open('https://plus.google.com/share?url=www.mywebsite.com/news/<?php echo "{$row['image_title']}.html" ?>','popupwindow', 'scrollbars=yes,width=500,height=400');popUp.focus();return false;" >
</map>

Related

I want to give green and red color for image areas

I want to show status with 0 area as red dot and status with 1 area are green. I used style tag for area. But not color coming on image area. Anybody knows please help me. I am sharing my code below
<html>
<map name="map1" id="_map1">
<?php
foreach ($points as $point)
{
$name=$point->name;
$status=$point->status;
if($status==1){ ?>
<area shape="rect" coords="10,15,18,20" href="<?php echo base_url()?>assets/images/green.jpg" alt="" title="" onmouseover="<?php echo $name; ?>" />
<?php
}
else if($status==0) {?>
<area shape="rect" coords="0,0,50,50" href="<?php echo base_url()?>assets/images/red.jpg" alt="" title="" onmouseover="<?php echo $name; ?>"/>
<?php
}
} ?>
</map>
<img id="map1" src="<?php echo base_url()?>assets/images/rectangle.png" usemap="#map1" border="0" width="800" height="600" alt="" />
</html>
See the example use of <map> Html map tag
The href attribute does not show the image (red or green). It is a hyperlink to the target image. The image displays on the screen is the src file of the <img> tag.
You may need to generate the image dynamically on the server side, or use <canvas> to render the data on the client side.

Inner Zoom image when clicking on fancybox image gallery

I am using fancybox for my web application
Jquery
$(".fancybox").fancybox({
openEffect : 'none',
closeEffect : 'none',
afterLoad :function() {
this.title = 'Click to Enlarge';
},
afterShow :function() {
$(".fancybox").zoom({on:"click"});
}
});
HTML
<script src="http://fancyapps.com/fancybox/source/jquery.fancybox.js"></script>
<link href="http://fancyapps.com/fancybox/source/jquery.fancybox.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<a class="fancybox" rel="gallery1" href="http://farm1.staticflickr.com/313/19831416459_5ddd26103e_b.jpg" title="Sgwd Ddwli Uchaf, Brecon Waterfalls (technodean2000)">
<img src="http://farm1.staticflickr.com/313/19831416459_5ddd26103e_m.jpg" alt="" />
</a>
<a class="fancybox" rel="gallery1" href="http://farm6.staticflickr.com/5444/17679973232_568353a624_b.jpg" title="Golden Manarola (Sanjeev Deo)">
<img src="http://farm6.staticflickr.com/5444/17679973232_568353a624_m.jpg" alt="" />
</a>
<a class="fancybox" rel="gallery1" href="http://farm8.staticflickr.com/7367/16426879675_e32ac817a8_b.jpg" title="Codirosso spazzacamino (Massimo Greco _Foligno)">
<img src="http://farm8.staticflickr.com/7367/16426879675_e32ac817a8_m.jpg" alt="" />
</a>
<a class="fancybox" rel="gallery1" href="http://farm6.staticflickr.com/5612/15344856989_449794889d_b.jpg" title="Morning Twilight (Jose Hamra Images)">
<img src="http://farm6.staticflickr.com/5612/15344856989_449794889d_m.jpg" alt="" />
</a>
I want to when open the fancy box image gallery after i click on center of image at the time if image are bigger than box then that zooming on inner of fancy-box and moving image on courser move.
Here on my code there is 4 images. if 2nd and 3rd image bigger than box then display title "Click to enlarge" and Zooming in on clicking only for 2nd and 3rd image not for 1st and 4th.
Thanks in advance on your replay
You should do like
$(document).ready(function(){
$(".fancybox").fancybox({
openEffect : 'none',
closeEffect : 'none',
afterLoad :function() {
this.title = 'Click to Enlarge';
},
afterShow :function() {
//$(".fancybox").zoom({on:"click"});
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/jquery.fancybox.pack.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/jquery.fancybox.min.css" rel="stylesheet"/>
<a class="fancybox" rel="gallery1" href="http://farm1.staticflickr.com/313/19831416459_5ddd26103e_b.jpg" title="Sgwd Ddwli Uchaf, Brecon Waterfalls (technodean2000)">
<img src="http://farm1.staticflickr.com/313/19831416459_5ddd26103e_m.jpg" alt="" />
</a>
<a class="fancybox" rel="gallery1" href="http://farm6.staticflickr.com/5444/17679973232_568353a624_b.jpg" title="Golden Manarola (Sanjeev Deo)">
<img src="http://farm6.staticflickr.com/5444/17679973232_568353a624_m.jpg" alt="" />
</a>
<a class="fancybox" rel="gallery1" href="http://farm8.staticflickr.com/7367/16426879675_e32ac817a8_b.jpg" title="Codirosso spazzacamino (Massimo Greco _Foligno)">
<img src="http://farm8.staticflickr.com/7367/16426879675_e32ac817a8_m.jpg" alt="" />
</a>
<a class="fancybox" rel="gallery1" href="http://farm6.staticflickr.com/5612/15344856989_449794889d_b.jpg" title="Morning Twilight (Jose Hamra Images)">
<img src="http://farm6.staticflickr.com/5612/15344856989_449794889d_m.jpg" alt="" />
</a>

php preg_replace href attribute using conditions

hello I have the following tags :
$content ='<a href="http://website.com/" />
<a href="/link1" />
<a href="https://website.com" />
<a href="link1" />';
and this code :
preg_replace('~href=(\'|"|)(.*?)(\'|"|)(?<!\/|http:\/\/|https:\/\/)~i', 'href=$1http://website2.com/$2$3', $content);
I want to use the code above to replace href tags doesn't start with an http or https or with a slash . thanks in advance.
Something like this should do it. I'd advise using a parser in the future, How do you parse and process HTML/XML in PHP?, for tasks such as this though. This can become very messy quickly. Here's a link on this regex usage as well, http://www.rexegg.com/regex-best-trick.html.
Regex:
/href=("|')https?:\/\/(*SKIP)(*FAIL)|href=("|')(.*?)\2/
Demo: https://regex101.com/r/cV2xB5/1
PHP Usage:
$content ='<a href="http://website.com/" />
<a href="/link1" />
<a href="https://website.com" />
<a href="link1" />';
echo preg_replace('/href=("|\')https?:\/\/(*SKIP)(*FAIL)|href=("|\')\/?(.*?)\2/', 'href=$2http://website2.com/$3$2', $content);
Output:
<a href="http://website.com/" />
<a href="http://website2.com/link1" />
<a href="https://website.com" />
<a href="http://website2.com/link1" />
Update, for // exclusion
Use:
href=("|')(?:https?:)?\/\/(*SKIP)(*FAIL)|href=("|')(.*?)\2
Demo: https://regex101.com/r/cV2xB5/2
PHP:
$content ='<a href="//website.com/" />
<a href="/link1" />
<a href="https://website.com" />
<a href="link1" />';
echo preg_replace('/href=("|\')(?:https?:)?\/\/(*SKIP)(*FAIL)|href=("|\')\/?(.*?)\2/', 'href=$2http://website2.com/$3$2', $content);
Output:
<a href="//website.com/" />
<a href="http://website2.com/link1" />
<a href="https://website.com" />
<a href="http://website2.com/link1" />

Passing variable along with link defined within map area

I am trying to pass variable along with link. In first page (test.php) I have variable $x that passes to second page (menu.php).
When I send it by normal link, variable got passed to the second page without an issue. But when same was passed with the link defined within map area tags, only the first instance of the variable got passed always. (Always print 0)
Could somebody help me?
test.php
<?php
for ($x = 0; $x <= 5; $x++) {
?>
<p>
<img src="uploads\network.png" width="1261" height="961" usemap="#planetmap">
<?php echo $x ; ?>
<map name="planetmap">
<area shape="rect" coords="91,31,211,151" alt="Sun" href="menu.php?projectid=<?php echo $x;?>" target="_blank">
</map>
</p>
link
<?php
}
?>
menu.php
<?php
$cell = $_GET["projectid"];
echo $cell;
?>
Actual HTML (View source)
<img src="uploads\network.png" width="1261" height="961" usemap="#planetmap">
0<map name="planetmap">
<area shape="rect" coords="91,31,211,151" alt="Sun" href="menu.php?projectid=0" target="_blank">
</map>
</p>
link
<img src="uploads\network.png" width="1261" height="961" usemap="#planetmap">
1<map name="planetmap">
<area shape="rect" coords="91,31,211,151" alt="Sun" href="menu.php?projectid=1" target="_blank">
</map>
</p>
link
<img src="uploads\network.png" width="1261" height="961" usemap="#planetmap">
2<map name="planetmap">
<area shape="rect" coords="91,31,211,151" alt="Sun" href="menu.php?projectid=2" target="_blank">
</map>
</p>
link
you will just want to have the in the file you are linking too$projectid = $_GET['projectid'];

how to use site_url for images in wordpress with php coding

<li><a href='#'>Core Transformation</a>
<img alt='arrow' src=**'http://localhost/wordpress1/wp-content/themes/twentytwelve/images/header-triangle.png'** /></li>
<li><a href=**'#'**>LINKS</a></li>
<li><a href=**'#'**>Contact Us</a></li>
How can I replace the src and href using the site_url() function?
You can use the following ways :
<img src="<?php bloginfo('template_url'); ?>/images/image.jpg" />
<img src="<?php echo get_template_directory_uri();?>/images/image.jpg" />
<img src="<?php home_url();?>/images/image.jpg" />
<img src="<?php echo site_url();?>/images/image.jpg"/>
you can do it same for href
More details refer codex
<img src="<?php echo site_url();?>/images/image.jpg"/>
or a better option would be:
<img src="<?php bloginfo('template_url'); ?>/images/image.jpg" />
You can do similarly for href
site_url() is used to append text on url.. so if you want to navigate to your directory and fetch something you can use it like this..
site_url('/images/default.jpg');
you can replace your src with following way:
<img src="<?php bloginfo('template_url'); ?>/images/yourimagename.extension" />
for more information about wordpress go to http://www.wpbeginner.com/wp-themes/wordpress-theme-cheat-sheet-for-beginners
that will help you more in future.
Still you getting any issues with that,then comment it.

Categories