webcomm / magento-boilerplate Goto Github PK
View Code? Open in Web Editor NEWHTML5 Twitter Bootstrap 3.1 Magento Boilerplate Template
License: MIT License
HTML5 Twitter Bootstrap 3.1 Magento Boilerplate Template
License: MIT License
I don't have a copy of CodeKit so I'm wondering what options are being run for JSHint or JSLint? I've looked through the codekit-config.json and still couldn't get it to pass
On the product page if you click an image the popup opens. If you browse to the left or right the bottom stretches while the image slides. The carousel does not do this in the original bootstrap.
Hi, I'm trying to add Owl Carousel to the home page of a Magento store with this boilerplate (thanks by the way!), however the carousel isn't showing up. I can see the images are loading using inspect element or Firebug, so I'm thinking it's how I'm initiating the carousel.
I added the code to initiate the carousel (see below) to the footer.phtml and it's appearing at the bottom of the page, is this an appropriate way? I'm loading the various css and js in the same order as they appear in the demo file for the carousel; the css for the carousel is loaded after the main style.css and the js files are loaded after script.js (I've also checked that the carousel works with the boilerplate's jQuery version). I've added the css and js in the dist folder and included them in local.xml.
If it helps, the store I'm working on is here. Does anyone know what I'm doing wrong, or know of a carousel-for-dummies that I could use?
<script>
$(document).ready(function() {
$("#owl-demo").owlCarousel({
navigation : true,
slideSpeed : 300,
paginationSpeed : 400,
singleItem : true
});
});
</script>
I got this error message when i clicked on a product to view its details: Parse error: syntax error, unexpected '[' in C:\xampp\htdocs\2magento\app\design\frontend\magentoBoot\default\template\catalog\product\view\media.phtml on line 41
I've always used modman for installing and I've been trying to do a Composer install. I'm not really understanding how the symlinking works. Are you guys still using modman to symlink?
What is your guys development workflow with Composer install?
Is this intentional or can I fix it?
I'm not saying you should fix it, but at least mention it in the readme
I am trying to install boilerplate. I am a beginner, so please bear with me.
following the steps in the tutorial to install the boilerplate, to automate the compilation with gulp, after installing gulp, when I call gulp, I receive this error:
I hope that is clear, no need for more vague points please :)
Error
/var/www/MYDOMAIN.com/httpdocs/skin/frontend/MY-THEME/default/js/script.js : line 14, col 9, Comma warnings can be turned off with 'laxcomma'. /var/www/MYDOMAIN.com/httpdocs/skin/frontend/MY-THEME/default/js/script.js : line 12, col 22, Bad line breaking before ','. /var/www/MYDOMAIN.com/httpdocs/skin/frontend/MY-THEME/default/js/script.js : line 22, col 9, Bad line breaking before ','. /var/www/MYDOMAIN.com/httpdocs/skin/frontend/MY-THEME/default/js/script.js : line 27, col 9, Bad line breaking before ','. /var/www/MYDOMAIN.com/httpdocs/skin/frontend/MY-THEME/default/js/script.js : line 45, col 9, Bad line breaking before ','. /var/www/MYDOMAIN.com/httpdocs/skin/frontend/MY-THEME/default/js/script.js : line 68, col 6, Missing semicolon. 6 errors [gulp] Finished 'lint' after 68 ms [gulp] Finished 'less' after 372 ms
I am install bower localhost in windows. I dont know what I do to compile gulpfile.js with bootstrap hove -dropdown
Just want to start off by saying this is an awesome project. Thanks for making it free and easy!
I just installed this onto magento 1.8.1.0 from the .zip file. I turned the theme on and everything seems to be working great except my dropdowns do not have the caret icon and there is not a category link in the dropdown like on the demo site. Any ideas on what's going wrong?
second level dropdown is not supported in the current version of bootstrap theme is there a chance to get support for this in the future.
What is the reason for having bootstrap js not located under /js/bootstrap/ and only containing bootstrap js stuff. The Bootstrap js file should only change if parts are added or removed so i think it's not necessary to compile them every time if custom js changes.
Anyway thanks for your work, really great stuff
Kind regards
Tobias
Hi, love the boilerplate. I'm trying to get IE8 working with respond.js using parallel connections but the current respond.js breaks when parallel connections are enabled. Presumably this is because respond.js works by requesting a copy of the css via ajax and with parallel connections enabled the css resolves in a different location. Its detailed on the git page (https://github.com/scottjehl/Respond) under the heading CDN/X-Domain Setup- i tried to follow the steps but the result didnt work. If you need more info on parallel connections theres a great post here http://www.nublue.co.uk/kb/article/utilising-parallel-connections-in-magento-353.html but basically they speed up magento big time so i think its something we would all benefit from.
Users can't log in to their account area ../customer/account/login/ when using this theme. If the theme is changed back to the default login works fine.
I'm new to Magento, but I was wondering about the last part in .gitignore
:
# If you want to be very clever, you
# will duplicate 'mytheme', as it
# inherits all styling from 'boilerplate'
# and makes upgrading easier!
!/skin/frontend/mytheme
But after reading about the default fallback hierarchy:
- Look for requested file in:
- app/design/frontend/custom_package/custom_theme/
- skin/frontend/custom_ package/custom_theme
- If not found, look for requested file in:
- app/design/frontend/custom_package/default
- skin/frontend/custom_package/default
- If not found, look for requested file in:
- app/design/frontend/base/default
- skin/frontend/base/default
- If not found, a rendering error will occur.
Doesn't that mean my theme should be located at: /skin/frontend/boilerplate/mytheme instead?
Hi,
In all template file like 1column, 2columns-left, 2columns-right, etc,. The tag is not open in these page.
I've updated gulpfile.js to add ?v=[hash] to end of references to dist/css/style.css and dist/js/script.js in the local.xml file so they are automatically cache busted.
This adds gulp-replace and event-stream as dependencies (see magento-boilerplate-package.json in the gist below).
There's room to polish this a little if you want, but it works for me, so I'd thought I'd share :)
In utilities.less we have
.bs-prototype-override{
display: block !important;
}
I am finding it being applied to a dropdown in a input group I am creating but the original element was display:table-cell and so this is breaking the input group.
Am I safe just to change this to display:table-cell or will it break something else I can't see?
With all the great work getting the frontend updated with Bootstrap 3, and of course the SMACSS organization of CSS I think it would be a great idea to also redo the admin panel in the same manner. Due to a lack of theme fallback methods for the admin it would need to be easily packaged and re-installed after any Magento upgrades.
The admin panel itself is rather mundane and with a number of extension developers adding their own top level navigation item the layout can quickly become cumbersome.
Plus speed is always viewed as an issue and any improvements to the number of files/images being loaded would have to improve page load.
Hello, magento-boilerplate seems exactly what i'm looking for. It's really great job!
I have couple of questions about next version of magenta compatibility.
How is it about Magento 1.9 compatibility. Is it planned? When could be possibly available? If it is in progress can I find somewhere thread?
Thanks
i've setup a local server using MAMP with apache on port 8888. i'm able to run gulp fine and it finishes no problem. although when i make changes to the less files, the watch task doesn't seem to be detecting the changes and won't run the task to livereload or recompile the css. any ideas?
Ben,
First of all thank you for updating this on a quick turn around.
I have noticed an issue though.
If a top level category has no child categories is still shows as a drop down (with the arrow next to it) and so doesn't go to a page and doesn't drop down.
With top level categories that do, it works fine but, the drop downs z-index is below the page content and so doesn't show on top.
Not sure if this is a big deal, i noticed a console error when I click on any menu items.
GET .../skin/frontend/tickledpink/default/images/bkg_divider1.gif 404 (Not Found)
...traced to script.js:4532
hey there,
today i reached in a project the 4095 selector limit per file.
the result is, that the IE9 does not read the hole css file.
the limitation is from the W3, so it is not a IE bug.
i fixed this issue with "bless" / "gulp-bless"
gulp.task('less', function() {
gulp
.src('less/style.less')
.pipe(less().on("error", notify.onError(function (error) {
return "Error compiling LESS: " + error.message;
})))
.pipe(minifycss())
.pipe(bless({
imports: true
}))
.pipe(gulp.dest('dist/css'))
.pipe(notify({
message: 'Successfully compiled LESS'
}));
});
Hi guys,
thank you very much for this great project. i am new to LESS. therefore i might make some errors. sorry for that!
i am using less.app from http://incident57.com/less/
i dropped the whole boilerplate folder into the app. i set output dir from
"./less/style.less" to "./css/style.css".
now i made changes to "./less/scaffolding.less". i saved it. now less.app starts immediatly compiling all files.
but i get an error-message in "./less/scaffolding.less":
NameError: .box-sizing is undefined in …components/bootstrap/less/scaffolding.less: *after { .box-sizing(border-box);}
did i miss something here? whats wrong with the compiler?
thank you very much
I have a default 1.8 install brand new. Installed via composer and now I get a white screen. I have tried tailing the error log but it does not say anything.
I cleared cache and still no luck.
Hi again!
i use the boilerplate in my recent project: www.smartlife.de/mage/taurumin.html
as you can see, i am trying to implement the bootstrap tab function (at the lower end of the page). but the tab.js file is missing. therefore the tabbuttons do not work. how can i append the tab.js file to the code the nice way? i am not that familiar with grunt and less. but i managed to work with codekit!
thanks!
nic
I use Grunt for task running.. Was trying to figure out why button groups weren't working.
I added it into app/frontend/boilerplate/default/less/buttons.less
@import "../components/bootstrap/less/button-groups.less";
Im having some trouble compiling the less files using the 'gulp' command. When I run the gulp command inside the themes folder, I get this response:
[gulp] Using gulpfile /var/www/MYDOMAIN.com/httpdocs/skin/frontend/MY-THEME/default/gulpfile.js
[gulp] Starting 'clean'...
[gulp] Finished 'clean' after 16 ms
[gulp] Starting 'default'...
[gulp] Starting 'less'...
[gulp] Starting 'lint'...
[gulp] Starting 'js'...
[gulp] Finished 'default' after 160 ms
/var/www/MYDOMAIN.com/httpdocs/skin/frontend/MY-THEME/default/js/script.js : line 14, col 9, Comma warnings can be turned off with 'laxcomma'.
/var/www/MYDOMAIN.com/httpdocs/skin/frontend/MY-THEME/default/js/script.js : line 12, col 22, Bad line breaking before ','.
/var/www/MYDOMAIN.com/httpdocs/skin/frontend/MY-THEME/default/js/script.js : line 22, col 9, Bad line breaking before ','.
/var/www/MYDOMAIN.com/httpdocs/skin/frontend/MY-THEME/default/js/script.js : line 27, col 9, Bad line breaking before ','.
/var/www/MYDOMAIN.com/httpdocs/skin/frontend/MY-THEME/default/js/script.js : line 45, col 9, Bad line breaking before ','.
/var/www/MYDOMAIN.com/httpdocs/skin/frontend/MY-THEME/default/js/script.js : line 68, col 6, Missing semicolon.
6 errors
[gulp] Finished 'lint' after 68 ms
[gulp] Finished 'less' after 372 ms
However, this seems to delete the dist/css folder inside my theme. The js folder seems to update correctly. It is just the css folder that gets deleted each time.
I used composer to install boilerplate and copied the files to my theme directory. Then I installed node.js, bower, and gulp according to the readme, but its likely I skipped a step somewhere since this is my first time using bower / gulp (or less for that matter). This is ubuntu 12.04 x32 and Magento 1.8.1.0.
PS. Thanks for providing such a great starting point for Magento. Im really learning a lot.
I installed the theme using option 3. As soon as I copied the files my top navigation disappeared. The previous template show it without problems.
I realized that the navigation disappears when copying the folder local
into /app/code/
. If I remove it the navigation appears, but it does not render properly once the package is activated.
Even if I disable the Webcomm_BootstrapNavigation module on the Advanced options it will still not show the navigation bar.
How can I fix this?
Did you guys disable subcategories in the topMenu or is it a real bug to be fixed?
When i try to create a subcategory in the admin it is being rendered by magento, but it never shows either on hover or click events.
Haven't yet figured out how or where, but when dumping the bootstrap dropdown.js in your ck.js. The button shows, clicking on it opens the hidden ul, clicking again on the button hides the whole parent div including the button group button.
(as a side question, how do you guys work with that ck.js file, you manually copy the bootstrap js that you need in to that file?)
Thank you guys for making this open source. It give me a huge head start for my next project. I have tried to use the theme on my Magento 1.8 site and everything works except when I try to view an individual product I get the following error:
Invalid method Mage_Catalog_Block_Product_View_Type_Simple::displayProductStockStatus(Array
(
)
)
I tried searching around various forums before bothering you but thought you might have a better idea on how I can troubleshoot this.
Hello
Love love LOVE this :) Thanks for the effort.
I was wondering how you can disable the responsiveness as I need to be able to switch it off but be able to switch it back on at a later date.
I've tried removing the viewport tag but it didn't make any difference.
Thanks
:)
Hi, i'm new to this but i've encountered a issue when using gulp watch function. When modifying a file (let's say a .less file), the related compilation function will be executed only once then no further modification will be taken into account.
I've discovered that the issue came from gulp-notify which seem to be unsupported under Windows for various reason (the notifier is overrided by Windows). Removing all the notify() solved my issue. However, using growl can solve this issue: https://github.com/yannickcr/gulp-notify-growl
This might be interesting to, at least mention it, so that new unfamiliar user with gulp doesn't get stuck.
Great work otherwise.
Composer install is failing when running composer install in the magento root dir on a local dev environment (on WAMP) - Windows 7. Root dir c:/wamp/www/magento. Composer.json file taken directly from the instructions here https://github.com/webcomm/magento-boilerplate. Magento ver. 1.8.1.0.
Error message below:
Loading composer repositories with package information
Installing dependencies (including require-dev)
Your requirements could not be resolved to an installable set of packages.
Problem 1
- Installation request for webcomm/magento-boilerplate 1.0.0 -> satisfiable by webcomm/magento-boilerplate[1.0.0].
- Can only install one of: webcomm/magento-boilerplate[dev-master, 1.0.0].
- Installation request for webcomm/magento-boilerplate dev-master -> satisfiable by webcomm/magento-boilerplate[dev-master].
Hi,
Just installed, everything worked great, but the menu looks like its not being loaded correctly (or at least like your demo).
I've verified that the module is loaded both in the directory (in apps/) and in the admin section (Disable Modules Output) and is enabled. No compiler is being use, caches are flushed.
No console errors of any kind, its looks like the top level categories get styles while the 2nd and 3rd are just visible and unstyled under the main menu items, rather than assembled and hidden on page load.
Hey guys, i decided to tryout your template for magento. But i can see it is missing some img files?
It's also a problem on the test site.
Files missing:
/images/btn_remove.gif
/images/btn_trash.gif
/images/btn_edit.gif
I don't know anyone has same experience, but I have an issue for IE 8 and IE9.
On the browserhace.com, I got layout issue on IE9 so I tested demo page (http://magentoboilerplate.webcomm.com.au/) and got same result. Header area doesn't display correctly.
Also, in IE8, there's no problem on layout, but dropdown doesn't work for both demo page and the site I'm developing.
Anyone can help me? Thank you
FIrst of thank you very much for your work and make it public it really seems like it will help me out as well as motivate me to start using less and nodejs.
I'm using node version 0.10.6 and gulp 3.6.1 and gulp-less 1.2.3; I set up the enviornment just right, and ran bower install, npm install. I notice that when I run gulp I get: starting clean, finsihed clean, starting default, starting less, starting lint, starting js; then finished default (then some script.js errors) then finsihed lint.
I never get a finished less or finished js. Although my less does seem to get updated when running gulp, but when I use gulp watch it and I update less it stays at starting less. it never updates... if i change something i js it updates, but the less task just seems to hang.
Hi,
We try to use it at our new site. but we found that we miss a lost of the pre-defined style which are in the bootstrap. and also, we didn't found the where the bootstrap js are imported.
Thanks
Cindy
Since applying the recent set of updates i have noticed IE8 is no longer working- the media queries are not getting applied so something must have upset the respond.js integration.
On your demo page the top navigation is not overwritten, too.
I tried to fix this issue, but I was not successful.
Other top navigation projects using a similar config.xml: http://goo.gl/yHNrbJ
I had an issue where if a menu item with children is displaying next to a menu item without children, the data from the childless item would bleed over into the other one's dropdown. So it was displaying the wrong category name. The update that fixed it for me was to detect a class of "parent" as well as "level0" for the top-level <li>
's. In Topmenu.php
:
protected function _addDropdownLink($html)
{
return preg_replace_callback('/<li\s+class="level0[^"]*parent.*?<a\s+href="(.*?)".*?>.*?<span>(.*?)<\/span>.*?<ul\s+class="level0.*?>/', array($this, '_addDropdownLinkCallback'), $html);
}
You may not have an answer to this just wondering if there is really that much difference between community and enterprise.
Thank you,
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.