Home Entrance Wiki Search Login Register

Welcome, Guest. Please login or register.
March 06, 2023, 02:15:02 am
Forum activity rating: Five Star Posts: 100/24hrs Show Unread Posts | Unread Replies | Own Posts | Recent Posts
News: :ozwomp: Reminder: Forum messages stay readable for years! Keep yours high quality! :ozwomp:

Show Posts

Messages | * Topics | Attachments

This section allows you to view all posts made by this member. Note that you can only see posts made in areas you currently have access to.

Topics - morrysillusion

Pages: [1]
1
ok, listen, i dont know the word that is used to describe a website like this but i am sure you will know what i mean when i give the examples. its been a hot minute since i focused on webdesign since the last months got kinda crazy... but i have ideas of layouts for my site that i have just always been a lil unsure how the tackle.

when is say website with "image based containers" i means like ones where the entire layout of boxes and whatnot arent defined by the existing css but rather an entire image/multiple images that make the layout!

examples,
https://uncannyvalley.neocities.org/
https://cinni.net/

uncannyvalley especially is done in a way i have seen most other sites done-- where it seems the layout image has been split into pieces. my main question is for one, is that the way to go about it? no ones giant image but multiple split up images? as i can see, it seems the basic idea is to set up your div containers to match the pixel size of your full layout, and then set those images to fill the entire area.

are there easier ways to go about this? im mostly dreading trying to figure out the pixel size of the entire image and how to split it up to fit in div boxes, honestly. admittedly tho my use of divs has always been kind of a mess as i feel like i may need to reteach myself some stuff to make sure i better understand how to tackle this idea specifically.


2
nooot sure if this topic exists in some form, but i was thinking about this as some random people i follow elsewhere try to dive into website making. and i see a lot of things people are doing that is making them struggle a lot, things that i did too. of course the journey to website making and learning it all yourself is quite a journey, and not exactly a smooth one! and i dont regret where i got. but i do wish i stopped myself from making some mistakes that hindered my progress quite a lot lol. getting ahead of myself, being overly confident and thinking "nah, i dont need to learn this" only to circle back and learn it because without it my website was a broken mess...

what are things you wish you were able to tell yourself earlier on to d:ha:not to do? what mistakes did you make, and inform others to consider when making a website?

my advice to myself and others is: dont use a site template if you seriously know nothing of setting up a webpage... no matter how easy it is made to use- if you dont know html or whatever, youre probably going to break it, and when you do, you wont have any clue why or how to fix it lol... i tried to use templates after doing some insanely basic html but didnt get css and all the settings. any attempt to customize it past colors broke it, and i didnt know why! and when i asked for help i didnt know enough to really understand the potential solutions i was being offered either.

i think templates are great actually but, boy is it good to know some stuff if you want to do anything more wish them. its been much more beneficial to understand at least some of it, so that i can fix the errors or at the very least pin down where i went wrong.


3
hiii back with another "help" thread or i guess "direct me to the best methods because i cant figure out what to do" thread.

ive been meaning to basically setup a gallery on my website, because i really dont want to link back to my social media, but i cant consider moving those links until i have actually....put art on my website. but with the loads and loads of art i have, the large high res files, and the overwhelming prospect of all the things i will need to throw on a page- im just not sure what way is efficient with my limited coding knowledge.

my vision is a grid layout with small thumbnails that can be clicked to open a pop up (not a new page or tab- jut over the existing page?) of the full image. the grid of thumbnails also getting longer on the page, the more i add i guess.

but i want to make sure this page 1) wouldnt take a horrendously long time to loads 2) wont fill up and insane amount of space on neocities-- im unsure if i should just be... uploading all the art to neocities, or if there is some remote way to connect this? not sure how to word that, basically i dont want to upload all my pieces to my neocities profile because i know it would take a lot of space.

lastly i dont know much in the way of details to coding galleries at all, and i will try to look into it. mostly wonder though if thsi concept would work, and how easy or complex it would be.... and suggestions/tips on hosting an art gallery on a web page like this too so that it is efficient and functional!


4
☔︎ ∙ Help & Tutorials / customizing scroll bars?
« on: July 09, 2022, 12:57:41 am »
ive been a bit slow on my website coding lately but, as ive been planning a new shrine page i realized i really wanted to make all elements immersive, and one thing ive failed to figure out it... custom scroll bar. if this something that can be changed just with html/css? or do i need to do a bit more?

ive had a weirdly hard time finding concrete answers about this that can keep my code as simple as possible, tbh. so im not entirely sure how it works to change that. any links or explanations appreciated! again id like to keep things simple but, dont mind having to use a bit of javascript if thats where this goes.

when i customaizing, i mean: changing the color mainly. but being able to change the shape, width, etc too.


5
✁ ∙ Web Crafting / What is your web design process?
« on: May 30, 2022, 08:49:18 pm »
this is quite a broad question but, being so early into designing my site i would love to hear about the process people went through in their web page designs and if anything specific drove you to a look, or had you decide what you have now was what you wanted? of course, people can and do change their pages all the time, but with what you have right now, id love to hear people's thoughts. i am just realizing how indecisive i feel when i flip through tons and tons of sites thinking "oh, i want to do that!" and "oh, that looks nice, ill do that--". it feels impossible to settle on something...

so while i havent finished my site or even gotten close to settling on a look for the long run, i have found that literally drawing out the layout has helped me conceptualize the look without coding it, but also stops me from in a sense wasting my time chasing a layout i may not even like by the time i finish writing it lol. of course, it looks and feels different when its actually made... but with all the fleeting ideas i am getting inspired by others, i think its helped to do that.

i am an artist but, not a web designer... and i imagine many many people here are also not web designers either lol. so im curious to hear if anyone has a specific way they tackle design. i think i get overwhelmed when i put it through my typical artist eyes or perfection, though.


6
❤︎ ∙ Greetings and Introductions / hello!!
« on: May 29, 2022, 07:11:57 am »
hi! meant to post this earlier haha... my name is Morry, and while i did come here for coding help at first, i keep wanting to pop around more forums too. but mostly for web help- its nice to have a beginner friendly space to ask for advice lol.

i currently host my site on neocities and i have so many things i plan to put on it... its been a slow but fun journey of learning html and i cant even describe how hype i get about developing it further lol. its been fun poking around all these other sites and getting inspired for what to do next. my more late stage website plans are in fact to host entirely on my own independently, as i do have a server desktop that is too powerful for its own good and im lucky enough to have a situation where i could do this reliably. and hopefully running my own forum down the line once i have most of/all my pages finished!

outside of my lil site, i am a digital art and writer. i went to college and dropped out, got an internship at cartoon network in 2019 and now im doing uhh not much since the pandemic, but i live alone with my doberman in a little house and its nice spending my time writing fanfiction, working on my site, and trying to figure out what im doing in life... my other hobbies include messing with retro computers/electronics, using vocal synths, cosplay, and cooking! but i also am trying to get into video game development too so we will see how that goes.


7
i am very much a hobbiest coder and just learning things as i go along. been working on a site for fun and i realized i wanted to use iframes on pages where i want users to call up lots of new information like articles/about pages/etc without making duplicate pages.... i already have the whole layout for a homepage but now im having trouble with the iframe i want to implement. there are two sidebars and a center box for the main content- which is where i want users to call information to by clicking whatever hightlighted links on the sidebars- filling up the main content box entirely and overwriting the base information in that box.

apologies this post will be LONG because i am adding the code i have, the website is live on neotcities but i havent added this newer code since it doesnt work. still feel free to look at it there too if you need.

Here is the css (there is specific information for the iframe too):
Code
			:root {

				/* applies to all areas */
				--font-family: monospace;
				--font-size: 14px;
				--line-height: 1.3em;
				--font-color: #504538;
				--link-color: #a26955;
				--link-text-decoration: none;

				/* main content (between sidebars) */
				--content-padding: 25px;
				--content-bg-color: #e6ded7;

				/* header */
				--header-height: 90px;
				--header-background: url('c_assets/outlet_gradient.png':wink:;
				--header-margin-bottom: 0px;

				/* sidebar */
				--sidebar-margin: 10px;
				--sidebar-width: 250px;
				--sidebar-padding: 10px;
				--sidebar-bg-color: #e6ded7;

				/* footer */
				--footer-height: 30px;
				--footer-bg-color: #e6ded7;

				/* navbar */
				--navitems-alignment: center;
				--space-between-navitems: 20px;
				--navbar-margin-bottom: 10px;
				--nav-bg-color: #e6ded7;

				/* container */
				--container-width: 1000px;
				--container-bg-color: #b79a75;

				/* controls the gap between the content and the footer */
				--row-gap: 5px;

				--sidebar-height: 100%;
				--sidebar-overflow: auto;
				--background-color: #b79a75;
			}

			html,
			body {
				margin: 0;
				padding: 0;
				background-color: var(--background-color);
				font-family: var(--font-family);
				font-size: var(--font-size);
				line-height: var(--line-height);
				color: var(--font-color);
			}

			body a {
				color: var(--link-color);
				font-weight: bold;
				text-decoration: var(--link-text-decoration);
				
			}

			#main-container {
				max-width: var(--container-width);
				margin: 0 auto;
				background-color: var(--container-bg-color);
				
			}

			iframe { 
				display: block; 
				width: 100%; 
				height: 100%; 
				border: none;
			} 

			.flex {
				display: flex;
				margin-bottom: var(--row-gap);
			}

			.content-wrap {
				margin-top: var(--content-margin-top);
			}

			#content-container {
				width: 60%;
				margin-bottom: var(--row-gap);
				background-color: var(--content-bg-color);
				border: solid;
				border-bottom-color: #504538;
				border-width: 4px;
			}

			#left-sidebar {
				width: var(--sidebar-width);
				margin-right: var(--sidebar-margin);
				margin-bottom: var(--row-gap);
				height: var(--sidebar-height);
				overflow: var(--sidebar-overflow);
				background-color: var(--sidebar-bg-color);
				border: solid;
				border-bottom-color: #504538;
				border-width: 4px;
			}

			#right-sidebar {
				width: var(--sidebar-width);
				margin-left: var(--sidebar-margin);
				margin-bottom: var(--row-gap);
				height: var(--sidebar-height);
				overflow: var(--sidebar-overflow);
				background-color: var(--sidebar-bg-color);
				border: solid;
				border-bottom-color: #504538;
				border-width: 4px;
			}

			#header-contained {
				height: var(--header-height);
				margin-bottom: var(--header-margin-bottom);
				background-image: var(--header-background);
				background-position: center center;
			}

			#footer {
				height: var(--footer-height);
				text-align: center;
				color: var(--font-color);
				background-color: var(--footer-bg-color);
			}

			#header-full {
				display: none;
				height: var(--header-height);
				margin-bottom: var(--header-margin-bottom);
				background-image: var(--header-background);
				background-position: center center;
			}

			#navbar-contained {
				margin-bottom: var(--row-gap)
			}

			#navbar-full {
				display: none;
			}

			.nav {
				margin-left: 0;
				text-align: var(--navitems-alignment);
				margin-top: 0;
				margin-bottom: var(--navbar-margin-bottom);
				padding-top: 1em;
				padding-bottom: 1em;
				background-color: var(--nav-bg-color);
				border: solid;
				border-bottom-color: #504538;
				border-width: 4px;
				
			}

			.nav li {
				display: inline-block;
				padding-right: var(--space-between-navitems);
			}

			.wrapper {
				padding: var(--content-padding);
				padding-top: var(--sidebar-padding);
			}

			.sidebar-wrapper {
				padding: var(--sidebar-padding);
				height: var(--sidebar-height);
				overflow: var(--sidebar-overflow);
			}

			.footer-wrapper {
				padding: 5px;
			}

			@media only screen and (max-width: 800px) {
				.flex {
					flex-wrap: wrap;
				}

				#left-sidebar {
					width: 100%;
					display: block;
					order: 2;
					margin-right: 0;
					margin-bottom: 10px;
				}

				#right-sidebar {
					width: 100%;
					display: block;
					order: 3;
					margin-left: 0;
				}

				#content-container {
					width: 100%;
					display: block;
					order: 1;
					margin-bottom: 10px;
				}

			}

And the HTML for the homepage:
Code
<!DOCTYPE html>


<html>
	
<head>
	<title>Coffini Outlet</title>

  <link rel="stylesheet" href="coffini_style.css">
	
</head>
		<div id="header-full" style="display: block;"></div>
		<div id="navbar-full" style="display: block;">
			<ul class="nav">
				<li><a href="https://morrysillusion.net/">Morrysillusion.net</a></li>
				-
				<li><a href="https://morrysillusion.net/coffini_outlet/coffini.html">Back</a></li>
				-
				<li><a href="/coffini_outlet/about_c.html" target="iframe_abt">About the name</a></li>
				-
				<li><a href="https://archiveofourown.org/users/morrysillusion/works">AO3</a></li>
			</ul>
		</div>
		<div id="main-container">
			<div id="header-contained" style="display: none;"></div>
			<div id="navbar-contained" style="display: none;">
				<ul class="nav">
					<li><a href="/index.html">Home</a></li>
				</ul>
			</div>
			<div class="content-wrap flex alignment">
				<div id="left-sidebar">
					<div class="sidebar-wrapper">
						<p><strong><u>Contact:</u></strong></p>
						<p>I made this blog because I like talking about things I like. Feel free to hit me up to chat!</p>
						<p><a href="https://twitter.com/morrysillusion/">- Twitter</a></p>
						<p><a href="https://morrysillusion.tumblr.com/">- Tumblr</a></p>
						<p>- mkc@morrysillusion.net</p>
						<p>- ask about discord!</p></div>
				</div>
				<div id="content-container">
					
					
					<div class="wrapper"><p><strong>Welcome to the Coffini Outlet!</strong> This is my little space to blab about things I like. Really, this is a "general" fandom oriented blog for anything that doesn't have a fan page/shrine!</p>
					
					<p>Below you will find links to the most recent posts (newest on top), where I may talk about a thing I consumed recently, or may be analysing the thing I consumed. All 'reviews' will be the title of the media as it is, anything with a 'subtitle' of sorts is an analysis/ramble about the thing!</p>
					
					<p>Check the right sidebar for older posts, which get archived after the year is over.</p>
					<h2 text align="center">MAY 2022</h2>
						<p text align=center>[tba]</p>
					 <iframe src="about_c.html" name="iframe_abt" title="Iframe About"></iframe></div>
				</div>
				<div id="right-sidebar">
					<div class="sidebar-wrapper"><p><u><strong>Archive:</strong></u></p>
						<p>Links will go here.</p>
						<p>post #</p>
						<p>post #</p>
						<p>post #</p>
						<p>post #</p>
						<p>post #</p>
					</div>
				</div>
			</div>
			<div id="footer" style="display: none;">
				<div class="footer-wrapper">footer</div>
			</div>
		</div>

Additionally, one of the example pages I want to call to the main content box. i stripped it down as i assumed thats how it should be for calling into into an iframe (since i just need the text, not a whole formatted page)
Code
<!DOCTYPE html>


<html>
	
<head>
	<title>Coffini Outlet</title>

  <link rel="stylesheet" href="coffini_style.css">
	
</head>
<body>
	<p>Welcome to my little ramble corner for things I like. You may be wondering where I got the name- its really just something that stuck after I used it on tumblr a while back.</p>
					<p>Around 2016 or so, I wasn't really sticking with any one name online. On tumblr, it was common to have "canon URLs" aka, URLs that were exact to a thing that you liked (character name, series name, location from a thing, etc). I was hopping around all kinds of URLs due to that and eventually changed it from what it was to "coffini".</p>
					
					<p>The word comes from an episode of Regular Show, <a href="https://regularshow.fandom.com/wiki/Rigby%27s_Graduation_Day_Special">the season 7 finale episode.</a> During it, Mordecai goes out of his way to try and get a fictional soda called Coffini. It's a coffee soda.</p>
					<center><img src="c_assets/coffini_can1.png"></center>
						<p>So there's a little bit of trivia for you. I just happened to use that word as my tumblr url for some time, until I picked up my own original name... The shows and episode are one of my favorites and it felt appropriate to reference something I liked when I brought up this page again. </p></body>

I put the <iframe> in the main content div of my homepage, and i wanted to figure out a few key things:
- i want to have various links be called into the same box (about page, an article, etc), if im going in the wrong direction to do that/need to know something about that id love to know.
- i want to have the iframe take up the entire 'main content' box, and fit the style/color of it (right now, its at the bottom, and is also the same color as the site background)
- when i load up the page, the content of the iframe is *already there*, when its supposed to only appear when the "about the name" link is clicked... and i dont understand why that is since all examples show it appearing after a link is clicked.

i know i have a lot of questions here and the psot is kinda long, so feel free to point me off site to guides etc (or email me- mkc@morrysillusion.net!). i just havent found clear answers to these problems im having, its hard for me to understand it out of context of what im specifically working on.


Pages: [1]


Melonking.Net © Always and ever was! SMF 2.0.19 | SMF © 2021, Simple Machines | SMFPacks Super Quote Forum Guide | Rules | RSS | WAP2


MelonLand Badges and Other Melon Sites!

MelonLand Project! Visit the MelonLand Forum! Support the Forum
Visit Melonking.Net! Visit the Gif Gallery!