On PageLoad show Magento Static block in ajax - ajax

I am running on Magento 1.7 and its a fresh copy.
What I want to achieve:
On pageload of the website, display the newsletter template block
{{block type="newsletter/subscribe" template="newsletter/subscribe.phtml"}}
as a pop-up window in Magento once, where the cookies will expire after a given period of time eg: 1 week.
The answers on web are either not specific, or not detailed enough as my knowledge is not broad on scripts.
What I tried so far:
attempt to add a lightbox:
1) Add Lightbox CSS & JS
<script type="text/javascript" src="<?php echo $this->getJsUrl('lightbox/lightbox.js'); ?>"></script>
<link rel="stylesheet" type="text/css" href="<?php echo $this->getJsUrl('lightbox/lightbox.css'); ?>" media="screen"/>
2) In view.phtml I added a link
Size chart
The lightbox is working but the static block is not called... still figuring out how to call a static box..

I have successfully called a popup consisting static block using the steps below.
http://jsfiddle.net/5USUu/
So basically we need to:
Add .js and .css files - I'm using colorbox
Define the function
Call the function
1) Add the following script in header
<link rel="stylesheet" type="text/css" href="<?php echo $this->getJSUrl('pop/colorbox.css'); ?>" media="screen"/>
<link rel="stylesheet" type="text/css" href="<?php echo $this->getJSUrl('pop/popup.css'); ?>" />
<script language="javascript" src="<?php echo $this->getJSUrl('pop/colorbox.js'); ?>"></script>
<script>
jQuery(document).ready(function (){
if (document.cookie.indexOf('visited=true') == -1){
var fifteenDays = 1000*60*60*24*15;
var expires = new Date((new Date()).valueOf() + fifteenDays);
document.cookie = "visited=true;expires=" + expires.toUTCString();
jQuery.colorbox({width:"580px", inline:true, href:"#subscribe_popup"});
}
jQuery(".open_popup").colorbox({width:"580px", inline:true, href:"#subscribe_popup"});
});
</script>
2) Add this link in html that link to your pop up
Click here to open the popup
3) Add the html that contains your static block identifier
<div style='display:none'>
<div id='subscribe_popup' style='padding:10px;'>
<!-- BEGIN #subs-container -->
<?php echo $this->getLayout()->createBlock('cms/block')->setBlockId('subscribe')->toHtml() ?>
<div id="subs-container" class="clearfix"> </div>
</div>
</div>
<!-- END subscribe popup-->

Related

Tiny mce unable to load in ci

gsaconst2/application/site/views/index.php
I already place tiny mce js in assets but unable to load it correctly. Can anyone help me check my codes if it is correct?
<!DOCTYPE html>
<html>
<head>
<script src="<?php site_url('assets/tinymce/js/tinymce/tinymce.min.js'); ?>"></script>
<script>tinymce.init({ selector:'textarea' });</script>
</head>
<body>
<textarea>Easy! You should check out MoxieManager!</textarea>
</body>
</html>
Change this:
<script src="<?php site_url('assets/tinymce/js/tinymce/tinymce.min.js'); ?>"></script>
To this:
<script src="<?php echo site_url('assets/tinymce/js/tinymce/tinymce.min.js'); ?>"></script>

My Nestedsortable is not working, because of cannot call the javascript file

Iam using CI version 2.1.2
iam following course by tutplus training
this problem is a when i call the javascript file that's not working properly
iam very counfused day to day iam thingking how make it solved, buat iam cannot
here the script of my page_head file
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title><?php echo $meta_title; ?></title>
<!-- Bootstrap -->
<link href="<?php echo site_url('css/bootstrap.min.css'); ?>" rel="stylesheet">
<link href="<?php echo site_url('css/admin.css'); ?>" rel="stylesheet">
<link href="<?php echo site_url('css/datepicker.css'); ?>" rel="stylesheet">
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="<?php echo site_url('js/bootstrap.min.js'); ?>"></script>
<script type="text/javascript" src="<?php echo site_url('js/bootstrap-datepicker.js'); ?>"></script>
<?php if(isset($sortable) && $sortable === TRUE): ?>
<script src="<?php echo site_url('js/jquery-ui-1.9.1.custom.min.js'); ?>"></script>
<script src="<?php echo site_url('js/jquery.mjs.nestedSortable.js'); ?>"></script>
<?php endif; ?>
Please Somebody help me, please make it file .js working
Use base_url instead of site_url.
For example, replace this...
<script src="<?php echo site_url('js/bootstrap.min.js'); ?>"></script>
...with this...
<script src="<?php echo base_url('js/bootstrap.min.js'); ?>"></script>
Do this for all link and script tag declarations in your head.
From the Codeigniter documentation:
site_url(): Returns your site URL, as specified in your config file. The index.php file (or whatever you have set as your site index_page in your config file) will be added to the URL, as will any URI segments you pass to the function, and the url_suffix as set in your config file.
base_url(): Returns your site base URL, as specified in your config file. (...) This function returns the same thing as site_url, without the index_page or url_suffix being appended.

Load specific js for certain pages in laravel

I am using laravel 4 for a project. Is there any way I can specify what js files I want to load for a certain view. Right now I am lumping all in one file.
When I use codeigniter, to load specific js files, i use a library to generate the script tags and echo them at the footer. something as below
$this->data['js'] = $this->js_lib->generate('jquery');
Then in my view
<?= $js ?>
Any idea how to do this in laravel?
Main Layout
main.blade.php
#include('includes.header')
<body>
<!-- main content -->
<div id="main_wrapper">
<div class="page_content">
#yield('content')
</div>
</div>
#include('includes.footer')
</body>
header.blade.php
<head>
<meta charset="UTF-8">
<title>My Page</title>
<meta name="viewport" content="initial-scale=1.0,maximum-scale=1.0,user-scalable=no">
<!-- common styles -->
<link rel="stylesheet" href="{{ asset('assets/bootstrap.css') }}">
<!-- page specific styles -->
#yield('pagespecificstyles')
</head>
footer.blade.php
<footer>
<!-- common scripts -->
<script src="{{ asset('assets/js/jquery.min.js') }}"></script>
<!-- page specific scripts -->
#yield('pagespecificscripts')
mypage.blade.php
#extends('layouts.main')
#section('pagespecificstyles')
<!-- flot charts css-->
<link rel="stylesheet" href="{{ asset('assets/lib/owl-carousel/flot.css') }}">
#stop
#section('content')
<div class="container">
Hello welcome to my page.
</div>
#endsection
#section('pagespecificscripts')
<!-- flot charts scripts-->
<script src="{{ asset('/assets/lib/flot/jquery.flot.min.js') }}"></script>
#stop
Stacks
Blade allows you to push to named stacks which can be rendered somewhere else in another view or layout. This can be particularly useful for specifying any JavaScript libraries required by your child views:
#push('scripts')
<script src="/example.js"></script>
#endpush
You may push to a stack as many times as needed. To render the complete stack contents, pass the name of the stack to the #stack directive:
<!-- Component Contents -->
#stack('scripts')
</body>
https://laravel.com/docs/5.7/blade#stacks
I know asked a while ago but for the benefit of others who may stumble here! One option is also in your layout to define additional sections, e.g.
#yield('css') <!-- In the head -->
#yield('js') <!-- Before the </body> tag -->
Then in your views
#extends('some.layout')
#section('css')
#include('js/dependencies/some/js/dependency/css.css')
#append
<!-- So in case these dependencies are used elsewhere you're not repeating your script or link tags over and over -->
#section('js')
#include('js/dependencies/some/js/dependency/js.js')
#include('js/dependencies/some/js/dependency/js2.js')
#append
#section('content')
Your actual content
#endsection
Just have a 'partials' view folder - and include whatever script you want in each view.
So in your view;
<body>
// Your main content here
// Other JS files you want in all views
#include('partials.analytics.blade.php')
#include('partials.googlemaps')
#include('partials.some_other_js_file')
</body>
Then have /views/partials/analytics.blade.php
<script>
// Your JS analytics script here
</script>
and just repeat for each 'script'
You may add the following code in your app.blade file
#stack('scripts')
and then you can use the jquery on page
#push('scripts')
<script type="text/javascript">
///Js code
</script>
#endpush

can not finding the css,js and images

i am very new in codeigniter.I have a static web page.i just want to convert it into dynamic web page.First of all i pasted all the files in the view folder of the MVC of the codeigniter.Here i have css, javascript and images folder and my php files.
I have created a controller like this..
<?php
class Saffron extends CI_Controller
{
function index()
{
$this->load->view('home');
}
}
?>
and my home.php page is just like this..
<!DOCTYPE html>
<html lang="en">
<head>
<title>Home</title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css"
media="screen" href="<?= base_url() ?>application/views/css/reset.css">
<link rel="stylesheet" type="text/css"
media="screen" href="<?= base_url() ?>application/views/css/style.css">
<link rel="stylesheet" type="text/css"
media="screen" href="<?= base_url() ?>application/views/css/slider.css">
<script src="<? echo base_url(); ?>application/views/js/jquery-1.7.min.js"></script>
<script src="<? echo base_url(); ?>application/views/js/jquery.easing.1.3.js"></script>
<script src="<? echo base_url(); ?>application/views/js/tms-0.4.1.js"></script>
<script src="<? echo base_url(); ?>application/views/js/vpb_script.js"></script>
<script src="<? echo base_url(); ?>application/views/js/pop.js"></script>
<!--start popup window ref-->
<link href="application/views/css/colorbox.css"
rel="stylesheet" type="text/css" media="all" />
<script src="<? echo base_url(); ?>application/views/js/jquery_002.js"></script>
<script>
$(document).ready(function(){
$(".image_show").colorbox({rel:'image_show', transition:"fade"});
});
</script>
<!--end popup window ref-->
<!--[if lt IE 8]>
<div style=' clear: both; text-align:center; position: relative;'>
<a href="http://windows.microsoft.com/en-US/
internet-explorer/products/ie/home?ocid=ie6_countdown_bannercode">
<img src="http://storage.ie6countdown.com/assets/100/
images/banners/warning_bar_0000_us.jpg" border="0" height="42"
width="820" alt="You are using an outdated browser. For a faster,
safer browsing experience, upgrade for free today." />
</a>
</div>
<![endif]-->
<!--[if lt IE 9]>
<script type="text/javascript" src="js/html5.js"></script>
<link rel="stylesheet" type="text/css" media="screen" href="css/ie.css">
<![endif]-->
</head>
<body>
<!--<div class="bg-top">-->
<div class="bgr">
<!--==============================Wrapper=================================-->
<div class="wrapper">
<!-----------------------Header --------------------------->
<header>
<div class="head">
<h1>
<a href="index.html">
<img src="<?php echo base_url(); ?>application/views/images/logo.jpg" alt=""></a>
sign up
<a href="javascript:void(0);"
class="classname1" onClick="vpb_show_login_box();">login</a>
</h1>
</div>
<?php
include_once('navigation.php');
include_once('slider.php');
include_once('offers.php');
include_once('invite.php');
include_once('testimonial.php');
include_once('special_item.php');
include_once('footer.php');
include_once('popup.php');
?>
Now what the mistake there...or anyelse that i can't recognizing??...please hlp me.
Thanks in Advance...
You forgot to put echo on several places.
I can show you my solution for putting files in header. First I made a folder in the root and named it public, and in that folder I created folders for needed documents (css, img, js...). In constants.php I made this:
$root = "http://".$_SERVER['HTTP_HOST'];
$root .= str_replace(basename($_SERVER['SCRIPT_NAME']),"",$_SERVER['SCRIPT_NAME']);
define('ABSOLUTE_PATH', str_replace('system/','', BASEPATH));
define('BASE', $root);
define('CSS', BASE . 'public/css/');
define('JS', BASE . 'public/js/');
define('IMG', BASE . 'public/img/');
So in the header you can do this:
<link rel="stylesheet" href="<?php echo CSS ?>reset.css">
This is a easy way to maintain and update your files.
Sasha gave a good solution, but to answer your question: all your CSS, images, JS should not reside inside the application folder, but in a folder on the same level as application. assetsis a common name for such a folder.
Try this:
in your config file, define the base_url() ex, base_url() = 'yoursite';
in root directory create a folder and name it resource and put all your css, js, img folders inside
in your html/php view file (ex. application/views/test.php) along with html code put these php codes, example
NOTE: don't worry about echoing the base_url in every js or css file that you link because base has been already defined.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Home</title>
<meta charset="utf-8">
<base href="<?php echo base_url(); ?>" />
<link rel="stylesheet" type="text/css" media="screen" href="resource/css/reset.css">
<link rel="stylesheet" type="text/css" media="screen" href="resource/css/style.css">
<link rel="stylesheet" type="text/css" media="screen" href="resource/css/slider.css">
<script src="resource/js/jquery-1.7.min.js"></script>
<script src="resource/js/jquery.easing.1.3.js"></script>
<script src="resource/js/tms-0.4.1.js"></script>
<script src="resource/js/vpb_script.js"></script>
<script src="resource/js/pop.js"></script>

Date picker is not working in Codeigniter

I am trying to add a calender in my application. The following code that I have is not working in codeigntier but it works fine if I put it into another folder outside codeigniter. Would you please kindly help me find out what the problem is?
Thanks in Advance
<html>
<head>
<link href="calendar/calendar.css" rel="stylesheet" type="text/css" />
<script language="javascript" src="calendar/calendar.js"></script>
</head>
<body>
<?php
//get class into the page
require_once('tc_calendar.php');
$myCalendar = new tc_calendar("date5", true, false);
$myCalendar->setIcon ("calendar/images/iconCalendar.gif");
$myCalendar->setDate(date('d'), date('m'), date('Y'));
$myCalendar->setPath("calendar/");
$myCalendar->setYearInterval(1971, 2035);
$myCalendar->dateAllow('1971-01-01', '2035-01-01');
$myCalendar->setDateFormat('j F Y');
//$myCalendar->setHeight(350);
//$myCalendar->autoSubmit(true, "form1");
$myCalendar->setAlignment('left', 'bottom');
$myCalendar->writeScript();
?>
</body>
</html>
It's likely that the paths to your assets are off. Try using base_url() in the calls to your assets and see if that helps. Your JS and CSS files would be loaded like this:
<link href="<?php echo base_url(); ?>calendar/calendar.css" rel="stylesheet" type="text/css" />
<script language="javascript" src="<?php echo base_url(); ?>calendar/calendar.js"></script>
base_url() will get you to the root of the application, so if the calendar directory is not at the root then update that path accordingly. Inspect the HTML that is produced and see if it is actually loading the assets.

Resources