How to open audio and video files in lightbox in wordpress - php

I want to open the audio and video files through the plugin in the wordpress.and i am currently use the plugin wp video lightbox plugin in the wordpress.
I have iframe code like..
<iframe width="325" height="64" src="http://www.ewihosting.com/evp/?id=Mi0wMSBJbnRlcm5ldCBSaWNoZXMgTWFkZSBFYXN5Lm1wMw%3D%3D&profile=default&mode=iframe" frameborder="0" style="background:#fff;" allowfullscreen></iframe>
and i use the logic like..
<li>
<span class="audio_upload_icon"></span><h3>Audio</h3><h4>Lesson #1</h4>
</li>
and i click on the image then open the lightbox but my audio file is not working but may video file is working are correctly.
So please advise me to which plugin very useful for me or any done the code modification.
Thank You.

I am assuming that you are self hosting your Wordpress, or at least you have access to your ftp files in your hosting service. If so, then:
You may wish to save a myvideo.html file in your server, then invoke it via
<li>
<a href="myvideo.html" rel="wp-video-lightbox[iframes]">
<span class="audio_upload_icon"></span>
<h3>Audio</h3>
<h4>Lesson #1</h4>
</a>
</li>
You can include the full path of your local html files, which allow you to make a folder inside of which you can save all your needed iframes, the code will look like this:
<li>
<a href="myvideo.html" rel="wp-video-lightbox[iframes]">
<span class="audio_upload_icon"></span>
<h3>Audio</h3>
<h4>Lesson #1</h4>
</a>
</li>
Lightbox, Shadowbox and other similar tools/plugins will now work. BUT if you are not self-hosting your wordpress nor be able to gain access to the files on your web hosting, you will need a different solution. Please let us know what is the case in order to provide the proper support.
Good luck!

You can use Fancbox Jquery Plugin.
Its pretty simple and usage. For more click here.

Related

Adjusting link paths in a Navbar PHP file for subdirectories

I'm trying to create a portfolio website. This is my third attempt, and I've been attempting to use PHP files for the first time. In my previous websites, I would copy large swaths of HTML into each page so that they would be formatted the same. With this website, I'm instead just trying to link to a few PHP files that contain code shared by multiple pages, like the navigation bar for instance.
My issue is this. Say in my index file
mywebsite/index.php
I include this PHP file which contains HTML code for a navigation bar
<?php
echo <<<EOT
<!-- Navigation Bar -->
<div id="nav">
<a class="nav-link" id="index-link" href="">About</a>
<div class="nav-divider"></div>
<a class="nav-link" id="resume-link" href="resume">Resume</a>
<div class="nav-divider"></div>
<a class="nav-link" id="portfolio-link" href="portfolio">Portfolio</a>
<div class="nav-divider"></div>
<a class="nav-link" id="contact-link" href="contact">Contact Me</a>
</div>
EOT;
?>
However, the way the links work, if I wanted to include this same navigation bar in a sub-directory webpage
mywebsite/portfolio/index.php
All of the links would stop working.
I've tried doing absolute paths to the root, but then the webpage's url shows the absolute path as well, including things public_html in the url which looks bad.
I've tried doing paths like "mywebsite.com/..." and "mywebsite/..." but thats just shows up as "mywebsite.com/mywebsite/..." and doesn't actually work. If I try saying "public_html/..." public_html becomes included in the url.
I don't want to create a second PHP file just to have the same code with slightly different href paths. Is there a path I could use for both my main directory and subdirectories that doesn't show up weird in the url? If not, is there a way to use Javascript or Jquery to detect if a file is in a subdirectory, and add "../" to all links inside the included PHP files?
I can't seem to find an answer to this question, maybe I'm not using the right words in my searches? This feels like it would be a common issue.

Laravel not showing images on localhost:8000

I am making a web page on laravel 5, I haven't used laravel since it was at 3 but I really like the new features that it has.
Everything its working fine on an app that it's almost finished, but I have a problem with images.
I am trying to display an image to a view and it's just not showing, I get the little image icon that we all know.
I have used all the methods that I have found on larval docks and in the forums.
including:
assets
URL
HTML (It didn0t work at all)
Direct Url in the view
I am actually using just Artsian serve so the URL would be something like:
http://localhost:8000/uploads/images/posts/1456814127.jpg
The folder its un public folder so in my opinion its the correct url.
With diffrent methos i aslo called the image from the pc path and its the same result. I am using intervention to upload the image by the way.
Any idea?
EDIT:
Ok i tried on localhost of wamp server and the image output worked. I dont know why but it did.
EDIT 2:
I am on laravel Homestead now, and it's still not working. I am angry by this point. Please help me!!
Here it's my Controller:
public function posts()
{
$posts = DB::table('posts')->paginate(3);
//page heading
$title = 'Latest Posts';
return view('frontend.posts.index')->with(compact('posts', 'title'));
}
This it's my view:
<a href="#" class="image">
<img src="{{ asset('uploads/images/posts/'.$post->post_image) }}" class="img-rounded">
<span class="hover-zoom"></span>
</a>
At laravel homestead the output link it's:
http://krubbit.dev/uploads/images/posts/1457074877.jpg
The dir structure of the image location:
-Laravel-dir
-Public
-Uploads
-images
-posts
-1457074877.jpg
Something like this
<img src="{{ asset('uploads/images/posts/1456814127.jpg') }}" />
Please use url funcion of Laravel as shown below
<a href="#" class="image">
<img src="{{url('asset/uploads/images/posts/'.$post->post_image)}}" class="img-rounded">
<span class="hover-zoom"></span>
</a>
Hope this will help..!!

Facebook share only certain div

So I have the following code for facebook share.
<a href="http://www.facebook.com/sharer.php?u=<?php the_permalink(); ?>" class="post_share_facebook" onclick="javascript:window.open(this.href, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=220,width=600');return false;">
<i class="icon-facebook"></i>
</a>
Right now, when the share button is clicked, the whole snapshot of the page is shown on the share window.
On a php file where this share button is located, I have a specific div which I want to show on the Facebook share window instead of the whole snapshot of the page.
Does anyone know how I can do this?
Thanks!
Not sure if its possible that way, you can try <?php the_permalink(); ?>#your_div_id
Another alternate would be using open graph

prestashop changing page icon doesn't work

I am using Prestashop for the first time. I try to change icons in the default theme but the change doesn't reflect on the UI
E.g: in block contact info, I have originally
<li>
<i class="icon-phone"></i>{l s='Call us now:' mod='blockcontactinfos'}
<span>{$blockcontactinfos_phone|escape:'html':'UTF-8'}</span>
</li>
I want to remove
<i class="icon-phone"></i>
and add my own icon <img src="\img\icons\call.png" />
But the UI still look the same after I changed the code to
<li>
<!--<i class="icon-phone"></i>-->
<img src="\img\icons\call.png" />{l s='Call us now:' mod='blockcontactinfos'}
<span>{$blockcontactinfos_phone|escape:'html':'UTF-8'}</span>
</li>
I use chrome inspector and see that the source code doesn't change at all. How can I add my own icons in prestashop?
It's because Prestashop uses 1) Module overrides and 2) Template cache system. You should disable cache memory in BO in Settings -> Performance and then clean the cache with the button on the top right. Next You need to edit:
not: root/modules/blockcontactinfos/blockcontactinfos.tpl
but root/themes/yourthemename/modules/blockcontactinfos/blockcontactinfos.tpl file.
This should help fix Your problems :)

php images change

Hi I was wondering what php code I can use that would allow my page to contain more than one image that changes. I would like the php code to output the HTML tag. Can anyone help me with this? Thanks!
you need to output all images to the browser from PHP, then use Javascpt to change the pictures. PHP is for server side scripts, the change you are talking about requires Client Side procxessing, ie Javascript. Do a search for jQuery image changer for some ideas
The kind of mechanism you are referring to is often called a slideshow or a carousel, and it is done with javascript. Google "jQuery slideshow" or "jQuery carousel" and you'll find plenty of those.
If you need something simple, I suggest you the tiny the jQuery plugin tiny carousel.
Scroll to the How To section to know how to set it up.
Then, to change the images with php, you will need to do something like this:
<div id="slider-code">
<a class="buttons prev" href="#">left</a>
<div class="viewport">
<ul class="overview">
<?php foreach(glob('slideshow/*.jpg') as $imagePath): ?>
<li><img src="$imagePath" /></li>
<?php endforeach; ?>
</ul>
</div>
<a class="buttons next" href="#">right</a>
</div>

Categories