Magento base url issue with MAMP Pro - php

I have a Magento website that I have cloned to my local machine running through MAMP Pro with a custom host name e.g: project.local
The issue is, the is a function in the file:
app/design/frontend/default/project/template/page/html/head.phtml
which includes a number of css/js files however the include path seems to be wrong using the base url/directory: /Applications/MAMP/htdocs/project_name/ which results in the files not being found. The function is:
$this->getCssJsHtml()
Here is a list of the files in question which I have taken from the source:
http://i.xomf.com/dcmsw.png
<link rel="stylesheet" type="text/css" href="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/css/styles.css" media="all" />
<link rel="stylesheet" type="text/css" href="/Applications/MAMP/htdocs/project_name/skin/frontend/base/default/css/widgets.css" media="all" />
<link rel="stylesheet" type="text/css" href="/Applications/MAMP/htdocs/project_name/skin/frontend/base/default/css/bubble/elasticsearch.css" media="all" />
<link rel="stylesheet" type="text/css" href="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/inchoo_socialconnect/google/css/button.css" media="all" />
<link rel="stylesheet" type="text/css" href="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/inchoo_socialconnect/facebook/css/button.css" media="all" />
<link rel="stylesheet" type="text/css" href="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/css/ajax-cart.css" media="all" />
<link rel="stylesheet" type="text/css" href="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/css/font-awesome.min.css" media="all" />
<link rel="stylesheet" type="text/css" href="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/css/tablet.css" media="all" />
<link rel="stylesheet" type="text/css" href="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/css/ie_10.css" media="all" />
<link rel="stylesheet" type="text/css" href="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/css/print.css" media="print" />
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/jquery/jquery-1.7.2.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/jquery/jquery.noconflict.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/jquery/jquery.joypopup.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/js/prototype/prototype.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/js/lib/ccard.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/js/prototype/validation.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/js/scriptaculous/builder.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/js/scriptaculous/effects.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/js/scriptaculous/dragdrop.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/js/scriptaculous/controls.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/js/scriptaculous/slider.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/js/varien/js.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/js/varien/form.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/js/mage/translate.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/js/mage/cookies.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/quickbuy.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/topmenu.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/event.simulate.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/html5.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/ajax_cart.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/jquery/jquery.CustomScrollbar.min.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/jquery/jquery-ui.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/jquery/jquery.selectbox-0.2.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/jquery/jquery.maketabs.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/jquery/jquery.flexslider-min.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/jquery/jquery.instagram.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/jquery/jquery.minitwitter.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/jquery/jquery.placeholder.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/jquery/jquery.jqzoom-core-pack.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/jquery.cookie.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/main.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/social_login.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/utagtracking.js"></script>
<script type="text/javascript" src="/Applications/MAMP/htdocs/project_name/skin/frontend/default/theme_name/js/play_video.js"></script>
Just to be clear, these are the only places that are effected. The other includes seem to relate to the base url set in the database: core_config_data.
I'm not sure if this is anything to do with MAMP Pro and the Virtual Hosts set-up, but needless to say I have tried everything I can after searching many... many hours on the internet for a solution with no success.
I would appreciate any help, thanks again in advance.

Typically simple problem, have you cleared js/css cache. This happens often when the server is moved from one location to the next because the directory path is cached when merged. Disabling Merge JS and Css files in system->developer javascript and css settings will correct the problem however you have to do some front-end hackery in order to actually save the value.
A way to verify this problem is to run the following query
SELECT *
FROM `core_config_data`
WHERE `path` LIKE '%merge%
If these values are set to 1 this will cause your problem, much easier to disable set to "0" this value via Database directly considering you have access. Then Clear Magento cache including JS / CSS cache and this should resolve your problem
Screen shot of what this should look like:

Related

how do I get jQuery and js working on heroku

I am new to Heroku and trying to get my app working on it. All works fine except non of my scrips are working. I have a PHP header file that provides all the links to e.g. jQuery etc. which I have stored in the js directory.
<title><?=$head_title;?></title>
<link href="css/admin.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/scripts.js"></script>
<link href="css/styles.css" rel="stylesheet" type="text/css" />
<script src="js/animatedcollapse.js" language="Javascript" type="text/javascript"></script>
<script src="js/functions.js" language="Javascript" type="text/javascript"></script>
I have an apache dyne (heroku-php-apache2) and a ClearDB MySQL database. How do I get jQuery running on Heroku?

404 on CSS and jQuery files

Here is my code:
<head>
<link rel="stylesheet" href="http://localhost/css/estilos.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript" src="../js/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
</head>
The program works, but if I use the inspect element, I get these warnings. Can anyone help me to figure it out?
Hope you can help me :D
The problem is that you have linked to your own version of jQuery incorrectly.
As you are already loading it twice from the CDNs, you shouldn't even need to load it locally. Just load the latest version of jQuery from the CDN once, and don't worry about loading a local copy as well:
<head>
<link rel="stylesheet" href="/css/estilos.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
</head>
Note that your CSS was throwing an error as well as your jQuery, meaning that you do not have a file at http://localhost/css/estilos.css. I've used /css/estilos.css/ in my anser, to refer to the root. This would point the CSS file at: [root]/css/estilos.css. Depending on your file structure, you may need to use css/estilos.css/ instead (without the leading slash). For more information about relative paths, check out CSS Trick's article.
Hope this helps!
It says your local css and js files are not found. look right at the debug panel, there is a 404 code.

ckeditor can't access root directory IE9

I always have some problems with IE. The problem is that my website must work on every browser, including IE.
Everything works well for the ckeditor plugin named prgfilemanager (I can add pictures into my ckeditor textarea). Every browser are working except IE... I first succeed displaying ckeditor using
<meta http-equiv="X-UA-Compatible" content="IE=9.0">
Without that meta, the textarea isn't a ckeditor textarea.
My problem is that when I try to add pictures, nothing happens ONLY IN IE.
When I click to search pictures there is a popup with the interface with no root..
If i write http://XXX/ckeditor/plugins/pgrfilemanager/PGRFileManager.php?type=Image&CKEditor=Description&XXX everything works well on every browser except for IE..
I'm on IE9. How to make pgrfilemanager working on IE 9 ?
This is what IE gives me
I found how to make it work. As I said, I used <meta http-equiv="X-UA-Compatible" content="IE=9.0"> in my files to make ckeditor working. What to do if you have the same problem that I HAD, in ckeditor\plugins\pgrfilemanager, open PGRFileManager.php and add the meta <meta http-equiv="X-UA-Compatible" content="IE=9.0"> on the <head>. Like
<head>
<!-- ADD THIS -->
<meta http-equiv="X-UA-Compatible" content="IE=9.0">
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>PGRFileManager v2.1.0</title>
<link rel="stylesheet" type="text/css" href="css/sunny2/jquery-ui-1.8.1.custom.css" />
<link rel="stylesheet" type="text/css" href="css/jquery.treeview.css" />
<link rel="stylesheet" type="text/css" href="css/fancybox/jquery.fancybox.css" />
<link rel="stylesheet" type="text/css" href="css/PGRFileManager.css" />
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.1.custom.min.js"></script>
<script type="text/javascript" src="js/jquery.treeview.js"></script>
<script type="text/javascript" src="SWFUpload v2.2.0.1 Core/swfupload.js"></script>
<script type="text/javascript" src="js/jquery.i18n.js"></script>
<script type="text/javascript" src="js/jquery.fancybox-1.2.1.pack.js"></script>
<?php if (PGRFileManagerConfig::$ckEditorScriptPath):?>
<script type="text/javascript" src="<?php echo PGRFileManagerConfig::$ckEditorScriptPath ?>"></script>
<?php endif;?>
<script type="text/javascript" src="lang/lang.js"></script>
<script type="text/javascript" src="js/PGRUploader.js"></script>
<script type="text/javascript" src="js/PGRContextMenu.js"></script>
<script type="text/javascript" src="js/PGRSelectable.js"></script>
<script type="text/javascript" src="js/PGRFileManager.js"></script>
<script type="text/javascript" src="js/PGRFileManagerContent.js"></script>
</head>

How to properly import library on Yii

In my project I am using imperavi-redactor library. But it seems it doesn't load properly.
When using the import() method, the library is properly loaded in the assets, but it doesn't work. If I modify the template I am using to manually load the css/js AFTER all other libraries, it works.
Here is the generated HTML:
<head>
<link rel="stylesheet" type="text/css" href="/assets/92dfc12c/redactor.css" />
<link rel="stylesheet" type="text/css" href="/assets/f5a106d4/jui/css/base/jquery-ui.css" />
<script type="text/javascript" src="/assets/f5a106d4/jquery.js"></script>
<script type="text/javascript" src="/assets/92dfc12c/redactor.js"></script>
<script type="text/javascript" src="/assets/92dfc12c/lang/es_ar.js"></script>
<title>Create Notification</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="/themes/p35/css/main.css" rel="stylesheet" type="text/css" media="all">
<link href="/themes/p35/css/mediaqueries.css" rel="stylesheet" type="text/css" media="all">
<!--[if lt IE 9]>
<link href="/themes/p35/css/ie/ie8.css" rel="stylesheet" type="text/css" media="all">
<script src="/themes/p35/js/ie/css3-mediaqueries.min.js"></script>
<script src="/themes/p35/js/ie/html5shiv.min.js"></script>
<![endif]-->
<!-- Slider -->
<link href="/themes/p35/js/responsiveslides.js-v1.53/responsiveslides.css" rel="stylesheet" type="text/css" media="all">
<!-- Redactor -->
<link rel="stylesheet" type="text/css" href="/assets/54ed052f/imperavi-redactor/redactor.css"/>
<!-- Scripts -->
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.1/jquery-ui.min.js"></script>
<script src="/themes/p35/js/jquery.ba-bbq.js"></script>
<script>window.jQuery || document.write('<script src="/themes/p35/js/jquery-latest.min.js"><\/script>\
<script src="/themes/p35/js/jquery-ui.min.js"><\/script>')</script>
<script>jQuery(document).ready(function($){ $('img').removeAttr('width height'); });</script>
<script src="/themes/p35/js/responsiveslides.js-v1.53/responsiveslides.min.js"></script>
<script src="/themes/p35/js/jquery-mobilemenu.min.js"></script>
<script src="/themes/p35/js/custom.js"></script>
<!-- Redactor -->
<script src="/assets/54ed052f/imperavi-redactor/redactor.min.js"></script>
<script src="/assets/54ed052f/imperavi-redactor/lang/es_ar.js"></script>
</head>
Notice how redactor.css, redactor.js and es_ar.js are included twice... The first time each file is included is because of using the regular import() method. The second time they are included is beacuse of manually modifying the template to include them.
I could forget about importing the module regularly, and just changing my theme to load required files all other libs, but I don't like it, and also it would be always loading a library that is only used in a few views.
Any idea of how could I manage to make the import() method work for me?
I can't tell from your code whether you're already using it, but I'd personally recommend the Yii-redactor extension. It handles all the registration of script files for you, all you do it create a redactor widget.
See here http://www.yiiframework.com/extension/redactor/

Saved CC not working in magento

My saved credit card payment option works well in default magento theme but not working in a custom theme. When we click on "Credit Card (saved)" option nothing happens. No textbox or dropdown is showing up with options to enter card details.
When we click to proceed to next step,the validation error pops up as usual.
I think some where javascript is breaking up. But error console shows no errors as well! Can anyone point out what may be the possible reasons with this error? What is the js needed to get Saved credit card option work?
I am getting this error in a jquery-mobile theme and my header has following parameters..
<script type="text/javascript" src="js/prototype/prototype.js"></script>
<script type="text/javascript" src="js/lib/ccard.js"></script>
<script type="text/javascript" src="js/prototype/validation.js"></script>
<script type="text/javascript" src="js/scriptaculous/builder.js"></script>
<script type="text/javascript" src="js/scriptaculous/effects.js"></script>
<script type="text/javascript" src="js/scriptaculous/dragdrop.js"></script>
<script type="text/javascript" src="js/scriptaculous/controls.js"></script>
<script type="text/javascript" src="js/scriptaculous/slider.js"></script>
<script type="text/javascript" src="js/varien/js.js"></script>
<script type="text/javascript" src="js/varien/form.js"></script>
<script type="text/javascript" src="js/varien/menu.js"></script>
<script type="text/javascript" src="js/varien/payment.js"></script>
<script type="text/javascript" src="js/varien/product.js"></script>
<script type="text/javascript" src="js/mage/translate.js"></script>
<script type="text/javascript" src="js/mage/cookies.js"></script>
<script type="text/javascript" src="js/mage/directpost.js"></script>
<script type="text/javascript" src="js/mage/captcha.js"></script>
<script type="text/javascript" src="js/mage/centinel.js"></script>
<script type="text/javascript" src="js/varien/weee.js"></script>
<link rel="stylesheet" type="text/css" href="skin/frontend/mytheme/default/jquery.mobile-1.0b3.min.css" media="all" />
<script type="text/javascript" src="skin/frontend/mytheme/default/jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="skin/frontend/mytheme/default/main.js"></script>
<script type="text/javascript" src="skin/frontend/mytheme/default/jquery.mobile-1.0b3.min.js"></script>
<script type="text/javascript" src="skin/frontend/mytheme/default/additional.js"></script>
<link rel="stylesheet" type="text/css" href="skin/frontend/mytheme/default/mobilephone.css" media="all" />
<link rel="stylesheet" type="text/css" href="skin/frontend/mytheme/default/mobiletheme.css" media="all" />
Here additional.js is Jquery.noConflict(); file.
Am I missing something?
If anyone can point out something, please share.
I found out Why it happens.
The jquery styles were missing in the page. So I gave a create event jQuery('#co-payment-form').trigger("create"); in checkout/onepage/payment/methods.phtml It conflicts the javascript of credit cards.
When I remove the create event. the code works well But Jquery-mobile styles are still missing. I need the styles too.
If anyone knows how to Overcome this situation please share it.

Categories