249 comments

Hi Tom,

I want to change primary color. I edited theme-style.scss and compiled it to css but got the error:

Error: Base-level rules cannot contain the parent-selector-referencing character '&'.
on line 442 of core/_navs.scss, in `@content'
from line 58 of assets/bootstrap_src/mixins/_breakpoints.scss, in `media-breakpoint-up'
from line 383 of core/_navs.scss
from line 43 of theme-style.scss
Use --trace for backtrace.

Could you help me on this?

Thanks.
Hi

Are you compiling with gulp or another preprocessor?

Thanks
Tom
Hi
I tried Sass command and Koala app. Got the same error.

Thanks.
Phuc
Hi,

It could be that the library versions in Koala are out of sync.

Try using gulp instead, here's the instructions for the /documentation/README.txt file:

Gulp is a task runner which we recommend you use gulp to compile the sass files into css. Included in AppStrap’s /theme directory are 2 files which gulp uses:
1. package.json - this defines the gulp dependencies AppStrap needs to compile the sass files
2. gulpfile.js - this defines the gulp tasks which should run to compile the sass files into css code, there are also some “clean up” tasks run on Javascript & images.

Installing Gulp:
Step 1) Gulp needs node.js & node package manager (npm) to run so those need to be installed first, instructions are here: https://docs.npmjs.com/getting-started/installing-node
Step 2) Open up terminal or command line and type the following command to install gulp globally on your machine:
npm install --global gulp-cli

Type “gulp -v” to ensure gulp installed correctly, if it did you’ll see something like:
[13:42:05] CLI version 3.9.1
[13:42:05] Local version 3.9.1

Step 3) Type the following command to install all the gulp dependencies defined by the package.json file:
npm install --save-dev gulp

If everything work correctly you should see a new directory called “node_modules” which is full of the dependencies. Once you’ve finished your development you can remove this directory and just run the above command again to get the latest dependencies each time.

Step 4) Type the following command to have gulp watch for file changes to the .scss & .js files:
gulp watch

Alternative you can just type “gulp” to compile .scss & .js files and compress all images in the theme on a one off basis. You can use “Ctrl” + “c” to exit gulp at anytime.

You can look for any errors in terminal after running the above commands.

To find out more about gulp see: http://gulpjs.com/

------------------------------------

Hope that helps
Tom
Thanks Tom. It worked.
hi what causes this error?

revolution.extension.actions.min.js:7 Uncaught TypeError: Cannot read property 'is_mobile' of undefined
at revolution.extension.actions.min.js:7
at revolution.extension.actions.min.js:7
(anonymous) @ revolution.extension.actions.min.js:7
(anonymous) @ revolution.extension.actions.min.js:7
revolution.extension.layeranimation.min.js:7 Uncaught TypeError: Cannot read property 'is_mobile' of undefined
at revolution.extension.layeranimation.min.js:7
at revolution.extension.layeranimation.min.js:7
(anonymous) @ revolution.extension.layeranimation.min.js:7
(anonymous) @ revolution.extension.layeranimation.min.js:7
revolution.extension.navigation.min.js:7 Uncaught TypeError: Cannot read property 'is_mobile' of undefined
at revolution.extension.navigation.min.js:7
at revolution.extension.navigation.min.js:7
(anonymous) @ revolution.extension.navigation.min.js:7
(anonymous) @ revolution.extension.navigation.min.js:7
Hi,

I've not seen this issue before & it doesn't seem to happen on the demo site: http://demos.themelize.me/appstrap3.0.8/theme/index.html

Have you made any modifications to the theme?

Thanks
Tom
Yes, Thank you for your prompt reply. The support is awesome.

I'm having this problem when I added the scripts in the header.
Because I get the following below messages when I run locally.

Error at loading Slider Revolution 5.0 Extrensions.
Local Filesystem Detected !
Put this to your header:
<script type="text/javascript" src="./assets/plugins/slider-revolution/revolution/js/extensions/revolution.extension.slideanims.min.js"></script>
<script type="text/javascript" src="./assets/plugins/slider-revolution/revolution/js/extensions/revolution.extension.actions.min.js"></script>
<script type="text/javascript" src="./assets/plugins/slider-revolution/revolution/js/extensions/revolution.extension.layeranimation.min.js"></script>
<script type="text/javascript" src="./assets/plugins/slider-revolution/revolution/js/extensions/revolution.extension.navigation.min.js"></script>

After I add the above scripts I get those undefined errors.
Hi,

You might need to move jQuery to the head too but these "Local Filesystem Detected" errors can be fixed by running the site on a live domain (ie example.com) or under localhost.
Slider Rev includes some JS libraries on the fly which requires a domain or localhost.

Hope that helps
Tom
Great thanks tom
Hi Tom

I think the presentation and narration of themes and works are very successful.
I want to buy.

"when preparing websites for personal or small-scale large-scale businesses"
to apply more than one customer, not a single customer
which license type you need to buy ?

Thank you for your interest
Hi,

I think you would need a multiple licence as it's more than one customer.

However, If you plan to resell or redistribute the theme you would need an extended licence.

We have very low prices on extended licences at the moment which will increase soon so now is a good time to get it.

Thanks
Tom
Thank you very much for your quick reply and detailed information.
I will consider buying it.
Best regards
csspt PURCHASED
In the "Onepager with slider" demo, when you choose one of the menus the page scrolls to that section, but the selected menu option does not change to "selected" color, intead the previous menu option does! How do i fix that?
Hi

Do you have a demo URL I can look at?

Thanks
Tom
csspt PURCHASED
Your demo: http://demos.themelize.me/appstrap3.0.8/theme/index-onepager.html
If you click on "Projects" the page scrolls down but the option "Pricing" is the one that gets highlighted. I'm using Chrome. Thanks.
Hi,

Ah ok now I see, thanks for reporting this.

We'll officially fix it in the next release but in the meantime here's updated versions for script.js & script.min.js which should fix it: https://www.dropbox.com/s/ghvlfjde66mznc3/hotfix-2017-09-08.zip?dl=0

Just overwrite the existing script.js & script.min.js files with the ones in the download above.

Thanks
Tom
Hello!
I'm trying to change the background image from index-jobs.html by another one with the same lenght/width, then the parallax stops working...
And the stange is that, even returning the original image, parallax continues not working...what happens?
Please help.
Thanks!
If this helps, after analyze a lot all the elements and css loaded, I found that data-css attribute is not working after changing the image...the styles "background-position: center top" and "background-attachment: fixed" are not being apllied in my changed version, while they are apllied normally in the original html.
After apply these styles in the styles sheet using Developer Tools on Chrome, the parallax is working again.
Any tips why data-css could not be working?
Hi,

Do you have the data-bg-img="X" before the data-css on the div?

The format of the data-css is quite important or jquery won't be able to read the properties correctly, must be wrapped with '' and no , after the last item, like:

data-css='{"background-position": "center top","background-attachment": "fixed"}'

Feel free to copy & paste your data-css code here so I can look.

Thanks
Tom
Tom, thanks for your return.

Finally I found the problem! Its name is: Thymeleaf using data-attributes with json contents.

For example, I had to replace this:
data-settings='{"persist": true, "mind": "#header", "breakpoint":992}'

By this:
th:attr="data-settings='{"persist":true, "mind":"#header", "breakpoint":992}'"

So ugly, but it solved the problem. I guess you should test your page using Thymeleaf and put a warning for future buyers if you confirm the problem.

Thanks!
In the replaced part the double quotes were replaced by unencoded quote chars --- & q u o t ; --- I put separated here because they were aumoatically converted in the above answer.
Hi,

Yeh JSON is quite sensitive and very easy to have a ' or " out of place.

Let me know any further issues
Tom
Hi! First off theme looks great!

Quick question:

When resizing the theme to its smallest width the site menu turns into a right side slide/push menu. Is there a way to change it to a drop-down or cover menu? Thanks! For us on smaller screens we'd need that.

Is there a way/demo to split a project page with project text on left 1/3 of page width and large images vertically on right with text between them?

Thanks! Great theme!
Hi,

Thanks for your kind words!

You can also use the collapse mobile menu (http://demos.themelize.me/appstrap3.0.8/theme/header-collapse-menu-responsive.html) or an overlay menu (http://demos.themelize.me/appstrap3.0.8/theme/header-overlay-menu.html) although the overlay will need a bit of tweaking for it to be responsive rather than constant. We'll add this to the next update.

Hope that helps
Tom
Hi Tom!

I got two problems on index-jobs.html:

1 - When I'm in the middle of the page, looking at jobs list, and refresh the page, the search field in the top of the page - above the background image - is displaced to a negative position, above the navigation bar.

2 - Responsiveness of the section Filter Jobs is not ok when changing to small and medium screen sizes.

Could you confirm these problems? If possible, could you help me with a solution in advance? I don`t know how to solve that.

Thanks!
Hi

We're currently away at a conference but will take a looked soon as possible.

Thanks
Tom
Hi,

I've now been able to recreate both these issues so we'll work on a fix for the next update.

The header will need some code changes but for the "Filter" sidebar just change the ""breakpoint":480" attribute to "breakpoint":992 and that should make it sticky only when it's aligned in a column grid.

Hope that helps
Tom
LarryTX PURCHASED
In the download that I got from WrapBootstrap, there is no "Old" folder as described in your README.txt folder. Actually, I'm not interested in the Bootstrap 3 version, but it does make the documentation seem inaccurate. I was looking for the "Old" folder in the interest of finding at least some documentation for the theme. The "documentation" folder only contains upgrade information. Since I'm not upgrading from anything, that's totally unhelpful. Where can I find documentation of what the theme contains, best practices for implementing it, how to use it, etc. Documentation, of course, is at the core of every bit software of any utility at all.
Hi

Thanks for pointing this out. The old directory was remove since Bootstrap 4 went into beta. We're update the docs in the next release, aside from that they should be up to date.

Thanks
Tom
LarryTX PURCHASED
Actually, there are no docs to be up-to-date because there aren't any docs in the download. The only thing in the download is information (not documentation according to any technical writer's definition) that says what to do when upgrading. There is no documentation on how to use the files, best practices, how different components interact an should be implemented, let alone what the different components are. There just isn't any of that in the download. I'm hoping that it is a missing element that you'll get out with the next release. Without it, your theme isn't useful at all.
Hi

There's a whole directory called /documentation within the download which has a README.txt file detailing how to do various things within the theme. Within the same directory is a folder called /upgrade detailing changes made between versions.
All the elements pages contain instruction on how to use the elements.

If you don't have these things you might need to download again or check that your referring to this theme.

If you have a specific support question you can't find in the docs please let us know
Thanks
Tom
Hi there,
it is a great theme.. Seriously you guys did an awesome job!!
when do you think you would release the admin template??
thanks alot
Hi there!

Thanks a lot for your kind words!! :)

We've hit some delays due to illness but we're working on an update for the frontend which should be out next week then we'll shift 100% focus to the admin theme. Realistically now I think we're looking at mid-November for the admin theme initial release.

Thanks again
Tom
Thanks alot
I am using the social-link & branding-* classes. I would like to use one for instagram, but it does not seem to work... Is there a list of social links that have been prepared?
Hi

This is actually something that is included in the next update which should be released next week. We've added a load of new social media brand colours for text & backgrounds.

Thanks
Tom
HI,
I am using the flexslider. How can I eliminate the time between slides, or make the transition more fluid?
https://cw-yournewsite.com/coach/index.html
Hi

Flex slider is actually deprecated and will be removed in the next major update so I'd recommend looking at the carousel page instead: http://demos.themelize.me/appstrap3.0.8/theme/elements-carousels.html

If you see the projects & transitions examples you should be any to do something similar. We'll add an example in a future release too.

Hope that helps
Tom
nikolab PURCHASED
Hi Tom, i can see a lot of buzz about admin theme, i am waiting it as well :)
I see you had some illness issue (hope you are ok now?) and you are scheduling it now for mid November; do you have by any chance some expected feature list you are working on (for the Admin Theme), that you can post maybe on your site, so we can take a (pre)look? Thnx.
Hi there,

Thanks for the comment! All ok here now but lost about 2weeks of work time through one thing or another.
Yes aiming for a relatively simple version released mid-Nov but this is just provisional and could change. We want a solid structure and core initially and then will build out new features in subsequent updates.

I've put up a spreadsheet on drive for users to make suggestions for the admin theme, please add any ideas you have, we consider everything our customers suggest! https://docs.google.com/a/themelize.me/spreadsheets/d/15JP436Z-uGrSYO6VCY81XhhyIFWud4uI1FN6TUf6oJg/edit?usp=sharing (if it gets spammed we might have to change the access to just commenting).

Thanks
Tom
John1 PURCHASED
Hi is there any update on the next release? I am mainly interested in the Material Design additions.
Thanks
John
Hi John,

We're working on an update to release next week which will contain new functionality, bug fixes & new niche pages.
After that we're going to focus on the much request admin theme/design for AppStrap.

I would say realistically speaking the material design additions might not happen until early 2018 as we've had a huge interest in the admin theme so had already planned that work in for the next big update.

We'll update the product page if this changes.
Hope that helps
Tom
ssswdon PURCHASED
I would like to add a brand logo to the left in the header. I thought I can just add a src tag as below. src="assets/img/logo.png"

Can you please let me know how to resolve this?

<a class="header-brand-text" href="index.html" title="Home" src="assets/img/logo.png">
<h1> <span>Get</span>Resqued<span>.</span>
</h1>
</a>
Hi

You can't add an src attribute to an a tag. Take a look at the bootstrap docs here: http://getbootstrap.com/docs/4.0/components/navbar/#brand

Let me know if it's still an issue
Tom
nialma PURCHASED
Hi again,

by the old version you have told me to change

Here are some snippets to help.

1. Find the data-toggle="jpanel-menu" element and within it change the content to:
<i class="fa fa-bars pl-1 menu-icon-off"></i> <i class="fa fa-times pl-1 menu-icon-on"></i> <span class="d-block">Menu</span>

The icons can be whatever icons you like that are included in the theme: http://demos.themelize.me/appstrap3.0.7/theme/elements-icons.htm

2. In your assets/css/custom-style.css file add the following:
[data-toggle="jpanel-menu"] .menu-icon-on {
display: none;
}
[data-toggle="jpanel-menu"].open .menu-icon-on {
display: block;
}
[data-toggle="jpanel-menu"].open .menu-icon-off {
display: none;
}

to set the brand and menu-button inverse.
I've test it with the Version 3.0.8 and it doesn't works.

Is this my misstake or how can i do this? I want change the menu-button and the header-logo and the menu should open at the left side
nialma PURCHASED
i mean version 3.0.9 not 3.0.8
nialma PURCHASED
When i change

<!-- mobile collapse menu button - data-toggle="collapse" = default BS menu - data-toggle="jpanel-menu" = jPanel Menu - data-toggle="overlay" = Overlay Menu -->
<a href="#top" class="btn btn-lg header-btn float-right" data-toggle="jpanel-menu" data-target=".navbar-main" data-direction="right"> <i class="fa fa-bars pl-1 menu-icon-off"></i> <i class="fa fa-times pl-1 menu-icon-on"></i> <span class="d-block">Menu</span> </a>

to

<!-- mobile collapse menu button - data-toggle="collapse" = default BS menu - data-toggle="jpanel-menu" = jPanel Menu - data-toggle="overlay" = Overlay Menu -->
<a href="#top" class="btn btn-lg header-btn float-right" data-toggle="jpanel-menu" data-target=".navbar-main" data-direction="left"> <i class="fa fa-bars pl-1 menu-icon-off"></i> <i class="fa fa-times pl-1 menu-icon-on"></i> <span class="d-block">Menu</span> </a>

The menu doesn't open
nialma PURCHASED
When i set data-direction="right" the menu opens but i need the menu to open left and this doesn't work with data-direction="left"
Hi
Sorry for delay been away.
Both directions should work so it could be a bug I'll review asap

Thanks
Tom
nialma PURCHASED
If it will help i can send you access via ftp and the url via email
nialma PURCHASED
I've tested all pages with includes this featcher all sites are not working with data-direction=left
Hi

Thanks for the info, no need for FTP access I can recreate it and will fix ASAP.
If its a quick fix I'll post the fix here, if not it'll go into the next update.

Thanks
Tom

Write a comment

This is a great way to give the seller feedback and ask them questions about their item.

You must sign in to write a comment

Sign in or sign up to make a purchase

$9
4335Purchases

Licenses: Details »

Single application $9
Version:3.0.9
Type:
  • HTML Template
Bootstrap: Compatible with 4.x
Layouts:
  • Responsive
Browsers:
  • IE 9, 10, 11
  • Latest Chrome
  • Latest Edge
  • Latest Firefox
  • Latest Safari
Uses Less:No
Uses Sass:Yes
Categories:
Tags: app, blue, bootstrap 4, green, modern, one page, sass, scss, shop ui
Item#:WB0C6D0H4
Released:4 years ago
Updated:2 weeks ago
Sold exclusively on WrapBootstrap
themelize_me

themelize_me

Signed up 5 years ago

Need an admin theme?

About Bootstrap

Bootstrap is designed to help people of all skill levels – designer or developer, huge nerd or early beginner. Use it as a complete kit or use it to start something more complex.

Unlike other front-end toolkits, Bootstrap was designed first and foremost as a styleguide to document not only its features, but best practices and living, coded examples.

Built to support new HTML5 elements and syntax with progressively enhanced components.

Browser support

Bootstrap is tested and supported in major modern browsers like Chrome, Firefox, and Internet Explorer.

Tested and supported in Chrome, Safari, Firefox, Internet Explorer, and Opera.
  • Latest Chrome
  • Latest Firefox
  • Latest Safari
  • Latest Edge
  • Internet Explorer 9/10/11
  • Latest Opera

Features & includes

Bootstrap provides an unparalleled array of features and reusable components that let you hit the ground running: