I am trying to use any of these page templates located here Zurb
Some of the template (navbar), but not the content. Basically when I try to navigate to some content nothing happens. I have added the route info to no avail, i.e. -
name: home
url: /
When I create the basic starter project from here: Zurb, the project comes with .scss and a templates.js file, however the page templates just have a .css file.
I've looked through the documentation but haven't found anything showing how to use the page templates. Do I need to creata a .scss file and template.js file on my own and if so how?
For use this templates you must follow this former instruction http://foundation.zurb.com/apps/getting-started.html
For short:
install foundation nodejs module
create app – insert your
put template to client folder
Related
I am quite new to django so I am sorry if I have overlooked something simple.
This is my current website: https://www.michealnestor.com
I am trying to remake it using react and django, and a lot of it is different, however I want to keep the functionality of being able to run my js apps from the website: https://www.michealnestor.com/projects EXAMPLE: https://www.michealnestor.com/projects/sortingalgorithms/ .
I want to be able to upload project folders, with html, css and js in them from the admin page, and then be able to open these projects from my website. I am not sure how to do this though.
I have tried manually placing such a folder in a templates folder in my app, and I have managed to use a view to load the html file, but this file can't seem to find the css and js.
Maybe I am going about this the wrong way, in any case I would appreciate some guidance!
I am not a coder, by any means, but I am confident in my ability to make HTML, CSS, and some PHP alterations to existing websites. I want to create a new page template for a client's BigCommerce storefront so the layout is specific to a content type; so far my attempts of uploading this template have not been successful and I am wondering if I am missing something.
Details:
I have not created a local installation of Stencil. I hope to just create the template and make changes via the online Theme Editor.
I have downloaded the theme from BigCommerce; my new page has been created from the default page.html file and then placed in the following path: templates/pages/custom/page/custom_page.html.
I have deleted the manifest.json file.
I compress the entire theme folder (zip) and try uploading it via My Themes.
I went into the config.json file and changed the theme name from the original.
I get the following error when trying to upload the theme: "There was a problem processing your theme".
So - what am I doing wrong? I assume it is a lot of things. Thank you for your help!
I am a Django developer just getting started with adding React to one page of my app, and really enjoying it so far. (It's a normal Django app with a home page, an about page, etc, but also a "chart" page with an interactive chart, and I want to build the interactive part in React.)
The problem is that I've started with the downloadable React starter kit and I'm not sure how to do things the 'right' way, and it's complicated by using Django to serve my project (all the tutorials seem to assume you're using node, which I'm not).
Right now I just have this in my Django template:
<div id="myapp"></div>
<script src="/static/js/vendor/react.js"></script>
<script src="/static/js/vendor/JSXTransform.js"></script>
<script src="/static/js/myapp.js"></script>
And myapp.js has all the React code. I'm aware this isn't really the grown-up modern JS way of doing things.
Now I want to use React Bootstrap, but it seems that the only sensible way to do that is with npm. So it's time to make the switch, but I'm not completely sure how.
I have run npm install react and npm install react-bootstrap from inside my static/js directory in Django. This has created a node_modules folder with various files inside.
So three questions from a confused newbie:
Where should I put my React code to work with these npm modules (should I use var React = require('react')?
Do I need to compile this code somehow (using webpack?)
How do I then integrate this with Django? Should I compile it all to myapp.js and just include that in my HTML template?
I'm also doing the same thing right now - moving away from embedded HTML script tags into require land. Here is the tutorial I am following, and here is my file system so far. I am doing it in Node but it shouldn't be that different for a Django project as the React frontend code is decoupled from any backend other than API URL's.
Your node_modules folder contains react-bootstrap. In your myapp.js, use the require('react-bootstrap') to load up the library which is contained in your node_modules folder.
Where should I put my React code to work with these npm modules (should I use var React = require('react')?
You can put the code anywhere. If your file system looks like this:
project/
react/
myapp.js
node_modules/
react source code
react bootstrap stuff
Then you can just do var React = require('react'); in myapp.js.
Do I need to compile this code somehow (using webpack?)
Yes, I would consult the webpack tutorial I linked earlier, it should explain how to compile all your React code into a single bundle.js. Here is also another good tutorial. This bundle.js file contains all the source code of your requires. So if your myapp.js looks something like
var React = require('react');
var ReactBootstrap = require('react-bootstrap');
then the bundle.js now contains all of the React and react-bootstrap javascript code, along with the myapp.js source code.
How do I then integrate this with Django? Should I compile it all to myapp.js and just include that in my HTML template?
I've only done work on Nodejs, but my React code so far hasn't touched any Node code, and I don't think it will touch any Django code (again I've never done Django so I might be wrong). All you need to do is compile with webpack, which spits out a bundle.js. You put that bundle.js in your HTML and it'll load up myapp.js.
ReactJS code is still JS code. Even though you do require/import/other module based syntax when coding, in browser you will still load the JS code by a script tag.
The problem is how to let the script generated by webpack(bundle.js) to work with other 'VanillaJS' script. For example, if you only write an individual component using React, like a small table. And its data(props/state) will depend on another element/event written in VanillaJS, e.g, a click listener on a button render by django template. Then the question is, how they communicate with each other.
So far, the solution I know is:
when you write React Code, instead of calling ReactDOM.render explicitly with preset props/state, you can store that in a global function, the arguments could be the props. You load this script first, then the other script can use this global function to trigger the React render Component.
I'm using Django Rest Framework to build an API and then connect to that API from React (using simple Create react app), this way the front end and back end are separated and the application is very scalable. The second way to do this, is call create react app then run build and point your django settings to that react build, this way the front end is not separated from the backend. I hope this helped, good luck.
I am setting up a Magnolia-based website and trying to place a template script into the templates folder in the webapp. However, I cannot find that folder anywhere. All tutorials say that, if I go to this directory magnolia-5.0/apache-tomcat-7.0.40/webapps/magnoliaAuthor in my enviroment, I can get it, but I haven't managed it.
I attach an screenshot of my magnoliaAuthor folder in which every folder that is supposed to be there actually is, except for the only one that I need (templates).
Hope you can help me with this. Thanks!
What kind of template?
If it is jsp, you can just place it anywhere you want in that folder and reference it from the template definition.
If it is freemarker template, those are by default served from either the classpath or from repository, so for testing you can just upload it to the repo via templates app http://yourtomcat:port/magnoliaAuthor/.magnolia/admincentral#app:templatesApp:;
BTW if you install samples module (add magnolia-templating-samples.jar in your WEB-INF folder), it will create folder "templates" in your webapp and extract sample jsp templates in that folder.
HTH,
Jan
Is it possible to find any open source template editors.. i wanted my site users to edit the contents of module as well as css. Once they click the edit, it should open a specific module or file name.. so the users can change the css and content and then click ok. Then after refresh the change in css and content should be reflected..
I am looking for something similar to the one in Wordpress Admin panel..where you can edit different files like header.php, style.css etc..
Any available scripts or demos or plugins or examples would be very helpful, as i can customize them to my needs
You can use html editor like fckeditor or tinymce and on server side save as php file and css file.
I on my site use JQuery rte editor and JSON RPC (Ajax -> PHP).
Finally i figured out the answer.. Some of them are
Bespin,
Ecoder
Ymacs
codemirror
emacs
they allow you to embed in your site.. and allow the users to edit the template of pages.