Jump to content

Recommended Posts

Hi all,

I'm a new to website building. Learned some CRASH course of js,jquery,php. Then I found CMS. Still learning around forum, youtube....

Anyway, please help me with some beginer questions:

1, About template - please correct me if I understand wrong : every page should be (or recommended) built on a template. So if in total I'll have 10 pages, 2 of them have same layout, I'll need 9 templates.  And, what fields a page includes, is not defined in page, but defined in the template that page uses. 

2,  Where to see what modules I've installed? is it in "Modules - Site"? 

3, I installed "PageTable Extended", then what?  As in a youtube tutorial, it should appear in Setup tab, but it doesn't.  What's in there: templates,fields,logs,comments. (I installed "Uikit 3 site_blog profile".)

4, I did a search in Processwire website for the famous "repeater matrix" module, and can not find it, there's a Repeater, as well as a Matrix. Is it not a module?

5, I watched this youtube tuts: https://www.youtube.com/watch?v=IHqnLQy9R1A

Anybody familiar with this tuts please help: 

After he analysed a target webpage layout he wanted to mimic, he created some fields, some template, then based on those he created a page and input some "content" in there, then clicked "view", it's just some text. So, here comes my question, he copied a folder "assets" (subfolders are: css,fonts,js,img) over, then the page have the appearance/layout he wanted to mimic. Where does that assets folder come from?

Appreciate any help.

Share this post


Link to post
Share on other sites

Hi @anderson and welcome to ProcessWire

In answer to your questions:

1. Short answer is yes, if you have 10 pages of which 2 have the same layout, then you will need 9 templates. HOWEVER, I recommend you read up on "Regions" and delayed output. You can have the _main.php template with all the common elements eg the header and footer, then you only need templates for the bits that are different, eg the page body. Alternatively, you can include  files such as header.php and footer.php into each page template file.

2. Yes, Modules - Site (or other tabs on that page)

3. "PageTableExtended" is an Inputfield module. Create a new field and assign it as type PageTableExtended then add it to your template(s)

4. There is a core fieldtype called "Repeater". This is not installed by default. You can install it from Modules - Core. 'Repeater' is a prerequisite of the commercial module, "ProFields" https://processwire.com/store/pro-fields/ which includes a number of fieldtypes including 'Repeater Matrix'.

5. The '/site/assets' folder is automatically created on the web server when you install ProcessWire. It's used by PW for all sorts of stuff and you can add your own files/folders if you wish. Typically you would access it with FTP or similar. It's not visible in admin area by design and a good place to store files you don't want to change

  • Like 2

Share this post


Link to post
Share on other sites
30 minutes ago, psy said:

Hi @anderson and welcome to ProcessWire

In answer to your questions:

1. Short answer is yes, if you have 10 pages of which 2 have the same layout, then you will need 9 templates. HOWEVER, I recommend you read up on "Regions" and delayed output. You can have the _main.php template with all the common elements eg the header and footer, then you only need templates for the bits that are different, eg the page body. Alternatively, you can include  files such as header.php and footer.php into each page template file.

2. Yes, Modules - Site (or other tabs on that page)

3. "PageTableExtended" is an Inputfield module. Create a new field and assign it as type PageTableExtended then add it to your template(s)

4. There is a core fieldtype called "Repeater". This is not installed by default. You can install it from Modules - Core. 'Repeater' is a prerequisite of the commercial module, "ProFields" https://processwire.com/store/pro-fields/ which includes a number of fieldtypes including 'Repeater Matrix'.

5. The 'assets' folder is automatically created on the web server when you install ProcessWire. It's used by PW for all sorts of stuff and you can add your own files/folders if you wish. Typically you would access it with FTP or similar. It's not visible in admin area by design and a good place to store files you don't want to change

WOW, thanks so much for your detailed help!

  • Like 1

Share this post


Link to post
Share on other sites

Hi @anderson 

I also started ProcessWire with this video. A must to do for a beginner.

 

About the asset folder containing images, css and js, this folder come from the free theme that you have to downloaded there : https://templatemag.com/demo/Spot/ (this is the theme the author is using to build the final website).

Once extracted, you can find the assets folder and it should be placed in the folder site/templates of your ProcessWire installation - along your templates - then you can continue to follow the tutorial. Do not mix this assets folder (which could be renamed of whatever you want, eg: mythemeassets) and the assets folder in site/assets which is a core "required" folder created by ProcessWire.

 

Good luck, you are on the good road ! 💪

On the same road you can pick that 

 

 

Edited by flydev
links
  • Like 2

Share this post


Link to post
Share on other sites
5 minutes ago, flydev said:

Hi @anderson 

I also started ProcessWire with this video. A must to do for a beginner.

 

About the asset folder containing images, css and js, this folder come from the free theme that you have to downloaded there : https://templatemag.com/demo/Spot/ (this is the theme the author is using to build the final website).

Once extracted, you can find the assets folder and it should be placed in the folder site/templates of your ProcessWire installation - along your templates - then you can continue to follow the tutorial. Do not mix this assets folder (which could be renamed of whatever you want, eg: mythemeassets) and the assets folder in site/assets which is a core "required" folder created by ProcessWire.

 

Good luck, you are on the good road ! 💪

Thank you, sir.

Share this post


Link to post
Share on other sites
10 minutes ago, flydev said:

Once extracted, you can find the assets folder and it should be placed in the folder site/templates of your ProcessWire installation - along your templates - then you can continue to follow the tutorial. Do not mix this assets folder (which could be renamed of whatever you want, eg: mythemeassets) and the assets folder in site/assets which is a core "required" folder created by ProcessWire.

Gotta love ProcessWire... it's so flexible. You can put stuff where it works best for you. I prefer to create a folder for my original HTML theme in site/assets. That way I know it's always going to be clean, then any changes/overrides go in site/templates. Whatever works for you 😉

  • Like 1

Share this post


Link to post
Share on other sites

true, I should must have specified that 😉

I just wanted to be sure he do not mix the 'assets' of the video and the the created one by PW by placing the 'assets' in the 'assets' folder hihi 

  • Like 1

Share this post


Link to post
Share on other sites
56 minutes ago, flydev said:

On the same road you can pick that 

 

 

You guys are so nice, first day I begin to love this place.

And exactly, this video tuts I was watching is from your post!

At the end of that thread, @Kiwi Chris talked about Bootstrap. I only heard about bootstrap, is it mainly about fitting PC,tablet and cellphone screen? If so, I am very interested, I could start my site base on that. Any bootstrap template/theme/profile recommendation? ---- my site will be a very simple one for a friend for his personal business, just like a business card.

Share this post


Link to post
Share on other sites
55 minutes ago, psy said:

Gotta love ProcessWire... it's so flexible. You can put stuff where it works best for you. I prefer to create a folder for my original HTML theme in site/assets. That way I know it's always going to be clean, then any changes/overrides go in site/templates. Whatever works for you 😉

I'll learn.

And thanks again, I appreciate it.  Though I know nothing about coding, I'm good at photography photoshop, if you guys need anything, just ask.

Share this post


Link to post
Share on other sites

Yes, Bootstrap https://getbootstrap.com/, Zurb Foundation https://foundation.zurb.com/ & UiKit https://getuikit.com/ are good places to start if you're unfamiliar with responsive websites. Actually, even if you are, they can save you a lot coding time.

ThemeForest is a good place to start.

I often buy a license for Canvas, https://themeforest.net/item/canvas-the-multipurpose-html5-template/9228123 which is based on Bootstrap, then place all the files in site/assets and as mentioned previously, use overrides/changes in site/templates.

ProcessWire uses UiKit3 as it's default responsive admin theme

 

  • Like 1

Share this post


Link to post
Share on other sites
2 minutes ago, psy said:

Yes, Bootstrap https://getbootstrap.com/, Zurb Foundation https://foundation.zurb.com/ & UiKit https://getuikit.com/ are good places to start if you're unfamiliar with responsive websites. Actually, even if you are, they can save you a lot coding time.

ThemeForest is a good place to start.

I often buy a license for Canvas, https://themeforest.net/item/canvas-the-multipurpose-html5-template/9228123 which is based on Bootstrap, then place all the files in site/assets and as mentioned previously, use overrides/changes in site/templates.

ProcessWire uses UiKit3 as it's default responsive admin theme

 

OK.

UiKit3? already on it. 

  • Like 1

Share this post


Link to post
Share on other sites

Hi @anderson,

welcome to the forum! If you want to learn and improve this is a great place to be. ProcessWire is a little different to other CMSs, meaning it is a LOT more flexible, but it is also a little bit more "complicated". In other words: It is more tailored towards the needs of developers and not people who want a quick&dirty click-click-done website.

Did you already do (and I mean DO, not READ 😉 ) the hello world tutorial? https://processwire.com/docs/tutorials/hello-worlds/

If you are looking for a good dev environment I'd recommend https://laragon.org/ (you need apache for PW) and https://code.visualstudio.com/.

Have fun!

  • Like 1

Share this post


Link to post
Share on other sites

@anderson

What the amazingly talented PW dev @bernhard said is true, especially the bit about it being different to point-n-click website builders.

Keep in mind that ProcessWire offers so much more on so many levels. Whether you want to get into module development or not is up to you. See the showcase for examples:

1. A landing page site of mine that used a number of custom & pro modules, including Repeater Matrix 

 

2. A landing page site from another PW dev that used nothing but core modules 

 

  • Like 1
  • Thanks 1

Share this post


Link to post
Share on other sites
1 hour ago, bernhard said:

Hi @anderson,

welcome to the forum! If you want to learn and improve this is a great place to be. ProcessWire is a little different to other CMSs, meaning it is a LOT more flexible, but it is also a little bit more "complicated". In other words: It is more tailored towards the needs of developers and not people who want a quick&dirty click-click-done website.

Did you already do (and I mean DO, not READ 😉 ) the hello world tutorial? https://processwire.com/docs/tutorials/hello-worlds/

If you are looking for a good dev environment I'd recommend https://laragon.org/ (you need apache for PW) and https://code.visualstudio.com/.

Have fun!

Thank you,sir.

hello world tuts?  not yet, I'll do it.

dev environment?  Great! That's the next question I plan to ask.

I appreciate your help.

  • Like 1

Share this post


Link to post
Share on other sites
59 minutes ago, psy said:

@anderson

What the amazingly talented PW dev @bernhard said is true, especially the bit about it being different to point-n-click website builders.

Keep in mind that ProcessWire offers so much more on so many levels. Whether you want to get into module development or not is up to you. See the showcase for examples:

1. A landing page site of mine that used a number of custom & pro modules, including Repeater Matrix 

 

2. A landing page site from another PW dev that used nothing but core modules 

 

Beautiful! I'll try to learn.

  • Like 1

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    No registered users viewing this page.

  • Similar Content

    • By eelkenet
      Hi! I've created a small Inputfield module called InputfieldFloatRange which allows you to use an HTML5 <input type="range" ../> slider as an InputField. I needed something like this for a project where the client needs to be able to tweak this value more based on 'a feeling' than just entering a boring old number. Maybe more people can use this so I'm hereby releasing it into the wild. 
      EDIT: You can now install it directly from the Modules directory: http://modules.processwire.com/modules/inputfield-float-range/
       
      What is it?
      The missing range slider Inputfield for Processwire. 
      What does it do?
      This module extends InputfieldFloat and allows you to use HTML5 range sliders for number fields in your templates.
      It includes a visible and editable value field, to override/tweak the value if required.  
      Features
      Min/max values Precision (number of decimals) Optional step value (Read more) Optional manual override of the selected value (will still adhere to the rules above) Configurable rounding of manually entered values (floor, round, ceil, disable) Usage
      Clone / zip repo Install FieldtypeFloatRange, this automatically installs the Inputfield Create new field of type `Float (range)` or convert an existing `Float`, `Integer` or `Text` field. To render the field's value simply echo `$page->field` Demo
      A field with Min=0, Max=1, Step=0.2, Precision=2

      Field with settings Min=0, Max=200, Step=0.25, Precision=2

       
      Todo
      Make the display-field's size configurable (will use the Input Size field setting)  Hopefully become redundant  
      Changelog
      005 (current version)
      - Fix bug where the Inputfield would not work properly within repeaters / repeater matrices
      004
      - Make rounding of manually entered values configurable (floor, round, ceil or disable)
      - Fix small JS bug when the value-display field was not displayed
      - Update README
      003
      - Code cleanup, add some ModuleInfo data & LICENSE
      - Submit to PW Modules directory (http://modules.processwire.com/modules/inputfield-float-range/)
      002
      - Fix issue where setting the step value to an empty value created problem with validation
      - Make the display-field optional
      001
      - Initial release
       
      Thanks!
       
       
    • By Gadgetto
      Status update links (inside this thread) for SnipWire development will be always posted here:
      2019-10-18
      2019-08-08
      2019-06-15
      2019-06-02
      2019-05-25
      If you are interested, you can test the current state of development:
      https://github.com/gadgetto/SnipWire
      Please note that the software is not yet intended for use in a production system (alpha version).
      If you like, you can also submit feature requests and suggestions for improvement. I also accept pull requests.
      ---- INITIAL POST FROM 2019-05-25 ----
      I wanted to let you know that I am currently working on a new ProcessWire module that fully integrates the Snipcart Shopping Cart System into ProcessWire. (this is a customer project, so I had to postpone the development of my other module GroupMailer).
      The new module SnipWire offers full integration of the Snipcart Shopping Cart System into ProcessWire.
      Here are some highlights:
      simple setup with (optional) pre-installed templates, product fields, sample products (quasi a complete shop system to get started immediately) store dashboard with all data from the snipcart system (no change to the snipcart dashboard itself required) Integrated REST API for controlling and querying snipcart data webhooks to trigger events from Snipcart (new order, new customer, etc.) multi currency support self-defined/configurable tax rates etc. Development is already well advanced and I plan to release the module in the next 2-3 months.
      I'm not sure yet if this will be a "Pro" module or if it will be made available for free.
      I would be grateful for suggestions and hints!
      (please have a look at the screenshots to get an idea what I'm talking about)
       




    • By Robin S
      Another little admin helper module...
      Template Field Widths
      Adds a "Field widths" field to Edit Template that allows you to quickly set the widths of inputfields in the template.

      Why?
      When setting up a new template or trying out different field layouts I find it a bit slow and tedious to have to open each field individually in a modal just to set the width. This module speeds up the process.
      Installation
      Install the Template Field Widths module.
      Config options
      You can set the default presentation of the "Field widths" field to collapsed or open. Field widths entered into the Template Field Widths inputfield are only applied if the Edit Template form is submitted with the Template Field Widths inputfield in an opened state. "Collapsed" is the recommended setting if you think you might also use core inputs for setting field widths in a template context. You can choose Name or Label as the primary identifier shown for the field. The unchosen alternative will become the title attribute shown on hover. You can choose to show the original field width next to the template context field width.  
      https://github.com/Toutouwai/TemplateFieldWidths
      https://modules.processwire.com/modules/template-field-widths/
    • By adrian
      Tracy Debugger for ProcessWire
      The ultimate “swiss army knife” debugging and development tool for the ProcessWire CMF/CMS

       
      Integrates and extends Nette's Tracy debugging tool and adds 35+ custom tools designed for effective ProcessWire debugging and lightning fast development
      The most comprehensive set of instructions and examples is available at: https://adrianbj.github.io/TracyDebugger
      Modules Directory: http://modules.processwire.com/modules/tracy-debugger/
      Github: https://github.com/adrianbj/TracyDebugger
      A big thanks to @tpr for introducing me to Tracy and for the idea for this module and for significant feedback, testing, and feature suggestions.
×
×
  • Create New...