Share reference for all view in HTML page using PHP - php

I am new in PHP programming but have some experience using .NET MVC 4.
In .NET, we can specify the HTML page which will act as main layout that share the references (e.g Bootstrap, CSSs, Javascripts etc.etc) which normally being called shared view "_Layout". In PHP, is this possible and if yes, how can I achieve that?
thanks a lot
example:
Below reference will be used for all views in the project if specified;
<head>
<script type="text/javascript" src="~/Scripts/jquery-2.1.0.min.js" ></script>
<script type="text/javascript" src="~/Scripts/jquery-ui-1.10.4.min.js"></script>
<script type="text/javascript" src="~/Scripts/bootstrap.min.js"></script>
<link href="#Url.Content("~/Content/bootstrap.min.css")" rel="stylesheet" type="text/css" />
</head>

Related

How to Get started to build UI of website

I developed a system with no styling (no bootstrap and CSS) now i need to add them. i do not have a proper knowledge about bootstrap but went through W3Schools and understood the concepts. Now my problem is I can not understand the sequence of implementation i.e what must be done first then second then third etc. and how to use the concepts. It would be grateful if someone could please provide me some help in sorting out my issues. Many thanks
All you need to do is add the stylesheets / js / etc. to your <head> section in your html like this:
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
</head>
From here on, you're ready to go.
See this as an example.

uploading Axure exported html to wordpress

I would like to upload my Axure exported html (some javascript, css, and html files - all static content) to my wordpress site.
Now, I know I can simply connect with ftp and upload the folder to the hosted drive. But I'm not sure if that's the prefered method, what security issues are the to resolve (htaccess files??), and how to link to the mockup I made in my Axure in a frame (so it dynamically resizes).
Am I trying something that's just impossible, bad practice, ... Would I need to touch php? because my web knowledge goes as far as js/css... newbie too.
Help?
Thanks!
I don't see any security concerns, or need to touch the htaccess file.
A sample of a wireframe I've shared and embedded in Wordpress is at: http://paulsizemore.com/4234-2/
Essentially, you need to add the references to the script files in the Wordpress content editor. You will need to add the web address to the href attributes of the tags.
The Wordpress Content Editor View
<meta name="apple-mobile-web-app-capable" content="yes" />
<link href="http://r4qr5p.axshare.com/resources/css/jquery-ui-themes.css" type="text/css" rel="stylesheet">
<link href="http://r4qr5p.axshare.com/resources/css/axure_rp_page.css" type="text/css" rel="stylesheet">
<link href="http://r4qr5p.axshare.com/LogIn_files/axurerp_pagespecificstyles.css" type="text/css" rel="stylesheet">
<!--[if IE 6]>
<link href="http://r4qr5p.axshare.com/LogIn_files/axurerp_pagespecificstyles_ie6.css" type="text/css" rel="stylesheet">
<![endif]-->
<script type="text/javascript">
AXSHARE_HOST_URL = 'http://share.axure.com';
AXSHARE_HOST_SECURE_URL = 'https://share.axure.com';
</script>
<script src="http://r4qr5p.axshare.com/data/sitemap.js"></script>
<script src="http://r4qr5p.axshare.com/resources/scripts/jquery-1.7.1.min.js"></script>
<script src="http://r4qr5p.axshare.com/resources/scripts/axutils.js"></script>
<script src="http://r4qr5p.axshare.com/resources/scripts/jquery-ui-1.8.10.custom.min.js"></script>
<script src="http://r4qr5p.axshare.com/resources/scripts/axurerp_beforepagescript.js"></script>
<script src="http://r4qr5p.axshare.com/resources/scripts/messagecenter.js"></script>
<script src='http://r4qr5p.axshare.com/LogIn_files/data.js'></script>
<!-- This is the iframe of the Axure Share URL -->
<iframe src="http://r4qr5p.axshare.com/" width="800"></iframe>

jQuery script breaks another JS script

I have a calendar script I got off the internet working fine. Recently, I tried incorporating a jQuery sorting script, but I can't get both working together. It's either the calendar script or the sorting one that works.
I don't have much jQuery experience. I've tried changing the order in lots of ways, changing the jQuery versions and commenting out a bunch of JS scripts but I still can only get either get or one or none of them working.
The page is password-protected and the information being pulled from the database is private, but if it helps I'll try and make a separate page with dummy data; but I hope the mistake is a glaring one.
Here's the page head:
<head>
<title>My Page</title>
<!-- css -->
<link rel="stylesheet" type='text/css' href="stylesheets/datatable.css"/>
<link href="stylesheets/pagination.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" type="text/css" href="css/jquery-ui-timepicker-addon.css" />
<link rel="stylesheet" media="all" type="text/css" href="css/Aristo.css" />
<!-- scripts -->
<!-- [if lte IE 8]>
<script language="javascript" type="text/javascript" src="scripts/excanvas.js"></script> <![endif] -->
<script type="text/javascript" src="js/jquery-latest.js"></script>
<script type="text/javascript" src="scripts/jquery.datatables.js"></script>
<script type="text/javascript" src="scripts/jquery.fullcalendar.js"></script>
<script type="text/javascript" src="scripts/jquery.placeholder.js"></script>
<script type="text/javascript" src="scripts/jquery.accordion.js"></script>
<script type="text/javascript" src="scripts/jquery.tabbed.js"></script>
<script type="text/javascript" src="scripts/application.js"></script>
<!-- If I enable this, the calendar works but the sorting script stops working:
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.8.23/jquery-ui.min.js"></script> -->
<script type="text/javascript" src="js/jquery-ui-timepicker-addon.js"></script>
<script type="text/javascript" src="js/jquery-ui-sliderAccess.js"></script>
</head>
Is there an obvious mistake here? I'm using someone else's jQuery. Let me know if there is any other info I can add that might help with this...
The problem is that you are loading the jQuery library twice when you uncomment the part in question. This will result in the second script overwriting the $ and therefore also all functionality the plugins above have already attached to it (their functions are living inside the $ object).
Simple solution to your problem: Only load jQuery once (preferrably via a CDN), load the original library as the first script, then load its plugins, and then load your own scripts.
The correct order should therefore be:
<!-- Loading jQuery via Google -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
<!-- Loading jQuery scripts -->
<script type="text/javascript" src="scripts/jquery.datatables.js"></script>
<script type="text/javascript" src="js/jquery-ui-timepicker-addon.js"></script>
<script type="text/javascript" src="js/jquery-ui-sliderAccess.js"></script>
<script type="text/javascript" src="scripts/jquery.fullcalendar.js"></script>
<script type="text/javascript" src="scripts/jquery.placeholder.js"></script>
<script type="text/javascript" src="scripts/jquery.accordion.js"></script>
<script type="text/javascript" src="scripts/jquery.tabbed.js"></script>
<script type="text/javascript" src="scripts/application.js"></script>
Your sorting script and your calendar script are using 2 different versions of jQuery. I assume the one your sorting script is pulling up is conflicting with the calendar one (the one commented out in your code). Specifically:
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.0.min.js"></script>
and:
<script type="text/javascript" src="js/jquery-latest.js"></script>
are competing with each other.

skype url handler or another app url handler for video conference

I want to build a website for ​​e-learning.
The course will be conducted via webcam and members will pay to attend the web cast.
I thought that Skype is a solution, but I need to find a way to block and unblock contacts using PHP through the page.
I have found a URL handler but only for a call skype:user?call I am not sure about other functions such as block and unblock.
I would like someone to help me with Skype and to tell me whether or not there is some other way I can handle it through the page or suggest to me another program that gives me more like google talk might.
Or is there a CMS that can do my work?
First of have a look at Skypes public API to get familiar with what is possible. Here's the pulic api page: http://developer.skype.com/accessories
Also have a look in the forum and see if you find anyone else that has done what you want to do: http://forum.skype.com/index.php?showforum=16
To implement everything in php there are some wrapper libraries available. Here's the most popular and developed one:
https://github.com/yoya/php-skype/blob/master/Skype.php
<head>
<title><?php echo SITE_TITLE; ?></title>
<script src="assets/js/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<link rel="stylesheet" href="assets/css/style.css">
<script src="assets/js/bootstrap.min.js"></script>
<script src="assets/js/data-table/jquery.dataTables.min.js"></script>
<script src="assets/js/data-table/dataTables.bootstrap.min.js"></script>
<link rel="stylesheet" href="assets/css/data-table/dataTables.bootstrap.min.css" />
<link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
<script type="text/javascript" src="https://secure.skypeassets.com/i/scom/js/skype-uri.js"></script>
</head>

How to reuse one html head section?

I am using zend and not using AJAX in my site. Therefore I have to include all my CSS and JS files in head section of every phtml page.
<html>
<head>
<link rel="stylesheet" type="text/css" href="mycssfile.css" />
<script type="text/javascript" src="myjsfile1.js"></script>
<script type="text/javascript" src="myjsfile2.js"></script>
.........
</head>
<body>
.........
</body>
</html>
Whenever I add any new CSS/JS file, I have to include it everywhere. Is there a good way that I can include all my CSS and JS file in a file/place and use that reference everywhere. May be there is a good way in zend.
I usually put my static suff in the bootstrap of the application in the _initViewHelpers method :
$this->bootstrap(array('frontcontroller', 'view'));
$frontController = $this->getResource('frontcontroller');
$view = $this->getResource('view');
$view->headLink()->appendStylesheet($view->assetUrl('/css/reset.css'))
->appendStylesheet($view->assetUrl('/css/clearfix.css'))
->appendStylesheet($view->assetUrl('/css/screen.css'));
$view->headScript()->appendFile($view->assetUrl('/js/jquery.1.4.3.min.js', 'text/javascript'))
->appendFile($view->assetUrl('/js/jquery.corner.js', 'text/javascript'));
And then from your layout file you call them through
echo $this->headLink()->setIndent();
echo $this->headStyle()->setIndent();
This site might also help you with bootstrap and application optimization
http://joegornick.com/2009/11/18/zend-framework-best-practices-part-1-getting-started/
In normal PHP, you would just put the common bits in another template and include it:
<?php include 'common/header_assets.php'; ?>
common/header_assets.php:
<link rel="stylesheet" type="text/css" href="main.css" />
<script type="text/javascript" src="myjsfile1.js"></script>
<script type="text/javascript" src="myjsfile1.js"></script>
With the Zend Framework, you would want to create a layout for all of your templates to share that would have these common bits:
http://zendframework.com/manual/en/learning.quickstart.create-layout.html

Categories