Trouble on having too many pages of code - html

What I am looking to do is to have a main page with a list of 20 or so photographs on it. When one of the images is clicked, I'd like it to open a new page with the description on that photo, a preview of that photo, and the option to buy it. Is the only way to do this is by writing a new page of code every time a new image is clicked, or is there a way every page can share the same code, while only changing the preview of the photo.

I believe that what you say can't be done with a front-end language, it requires more of a CMS to do such thing, requires back-end job with an engine (PHP as example) and database such as MySQL.
Please remember that the HTML is a Markup-Language not a programming language, it has no logic as "if and else"..
I hope that answered your question. <3

Related

Advices for a simple CMS

I have a single page website built on top of Bootstrap that I use as a template to publish written articles. I have to write a new one every time I copy the page, and edit the html. I would like to speed up these voyages into the tags hell, and also make this page editable from someone that is just a user, not a web designer.
I don't want to use Wordpress, or any other major league CMS, I just want to have an admin interface that I (or someone else) can use to edit the text on my page. Any suggestion on how to start to achieve this?
Is there any open source tool to help me out?
From what I believe, there are a lot of open-source rich text editor tools that you can adopt in your own site:
https://quilljs.com/
http://substance.io/
https://draftjs.org/

"Mark as favourite" feature for a web page

(I'm quite new to programming so forgive me for any incorrect terms! HTML and CSS are my strenghts.)
I'm currently working on a Joomla website for a music festival. One of its pages contains a schedule with a list of performing acts.
My ambitious goal is to build a feature that makes my website's users able to mark certain acts as their favourites. In practice, clicking an icon would give it a visual highlight or something like that. The ideal situation would be that the user shouldn't have to sign in to save one's choises. I guess the solution would have something to do with the browser's local storage?
Here's one example for what I mean. (This is NOT my site, just an example of something I'm looking for).
Can anyone help me to get started? Thanks in advance!
This extension, http://extensions.joomla.org/extension/my-shortlist , should help with little or no modifications to the template.
If the above doesn't help, then you can the JED (the Joomla Extensions Directory) for an extension that is better suited to your needs.

What can I do to help someone else easily edit the website I am working on?

I am currently in an internship and making a website for someone. I have nearly finished the website and they would like a way to easily edit the website without messing around too much with code. They have no development team and once my internship is over, obviously they'll be stuck and they would like a way to edit the content on the website. How can I go about doing this? I mentioned a WordPress site to them but they didn't like the sound of that. Are there any other ways in which I can allow them to have this functionality?
Cheers
You can either create a Wordpress-similar, with a login, and while navigating through pages they would have options normal users do not have (e.g: delete, etc).
Or you could create an admin dashboard, where there would be every settings.
I think the second one is the best option for you, as it doesn't require you to modify any pages already created, and you will not have to adapt the style of your website to those supplementary options which would be shown on every pages if you used the first option.
Edit:
Or you could have all the content of the website in files, so that they simply need to edit the files to change the content. Even though I think option 2 is better, this one is a lot simpler to put in place.

How do i code a scrolling window to stay at a certain link per page

On this page, I want to get my scrolling dinosaur name window to specifically keep that dinosaurs name at the top so the person doesn't have to scroll all the way down to the next dinosaur.
I also want to know if there's an easier way to do this window.
My predicament is this....
I have over 30 dinosaurs on here. Each time I add a new one I have to update each and every one of the dinosaurs pages to add that one new dinosaur. Its not really time effective... Is there a better way without having to use frames?
My code is open so you can look at it and modify it at your leasure.
Thanks!
Vince
At this point I would suggest you go for server side code. Since you have 30 dinosaurs, it would be much easier to create and maintain a simple page using server side scripts such as PHP or ASP.NET to load the dinosaur from a database.
What are server side scripts?
Server side scripts allow you to dynamically generate a page on the fly whenever the user requests a page. For example, take youtube's search page. Rather than generate a seperate page for every single possible search term, they simply have a base template there, and then they fetch the relevant results based on the search query. The same can be applied to your site. You can have one page for all the dinosaurs, and you would just load the appropriate dinosaur based on the url.
Once you do that, putting the current dinosaur at the top of the page would be a trivial task. Since it appears that you already have a fair amount of knowledge in HTML, it should be easy for you to pick up and use some PHP. Codecademy has some excellent tutorials.
Along the same lines as Kevins answer but more specifically I'd like to recommend you look into a PHP MVC framework such as CakePHP, Laravel or CodeIgniter.
You've done all the hard work manually building these pages, which is awfully time consuming.
Once you learn one of these frameworks and you'll rebuild this site in a day.
If your links had id attributes on them you could scroll the list to a position by linking to #whatever. Here's a quick code example of a link.
<li id="camarasaurus">Camarasaurus</li>
Here's a small example: http://jsbin.com/ExExEvAB/1/edit?html,css,output
As for making it easier to administrate, I'd look into PHP since it's widely available and there's tons of resources to learn from. When you're basically looking for is <?php include "dinosaur-menu.html" ?> since you're thinking in terms of frames. You can make it even easier but this alone should make it a ton easier to update.
I really started to enjoy Mixture recently. It's great for prototyping and is, in my opinion, perfect for exactly what you're trying to do here.

How to build a navbar that scales with site growth

I have a navbar, and in it right now I have links to various blogs on my site. I have that same markup throughout my site on all pages.
Here is the thing, when I start growing my site, how do I scale something like this? Right now, I have been going to each and every html page, and doing a copy/paste anytime I need a new link to it or something similar.
I'm sure there is a better way to do this.
so a s per the comment's above there is a slew of ways to go about doing this. One possibility, would be to keep each link as a varchar as well as possibly a title that you want to display for each blog post that would be displayed in the nav bar. then you could build your nav bar dynamicaly each time using a scripting language such as php, python, perl, nodejs etc. Im not sure if node.js will be supported by godaddy but undoubtedly the other would be. The approach you take will be a personal choice based on if you control when user upload content (like an administrator) or if uploads can happen freely. if you plan for uploads to happen freely you will most likely want a dynamic approach, However if You plan to have an administrator to oversee each new entry a static approach could be used and called to regenerate the nav. bar each time a new post is made available. Again, if you need some help getting this started you know where to find me!
-best of luck