All the latest Neocities site news!

Neocities allows anyone to create a free web site to express themselves. Want to create your own awesome site? Join us!

SUPER COOL SITE !!!
1 like
Hello again! I am very inspired by your website. I especially love the sleek minimalistic layout, responsive design of the nav bar, original banner with added text title, and the zonelets blog you're maintaining! I read through your Copyright page and the Creative Commons License agreement, and I saw you mention that copying your source code for learning purposes is okay with you. How do I do that? c: Thanks so much
1 like
pixelglade's avatar pixelglade 2 years ago

Thank you! Feel free to take a look at the source code - the way to do it on Firefox on Windows is to right click on the web page and click View Page Source. There are some Javascript objects on the homepage for the Search and the Webrings so I would recommend looking at a simpler page so there's less clutter. Interpreting what you see will become easier as you write/learn more HTML/CSS code.

1 like
pixelglade's avatar pixelglade 2 years ago

One of the simpler pages is the Contact Me page. view-source:https://pixelglade.net/about/contact.html The responsive parts are due to the divs flexcolumn and flexbox. To see what they are referring to you open the .css style page.

1 like
sugarblush's avatar sugarblush 2 years ago

Thank you so much!! I really appreciate it c: I'll do my best. Something I'm struggling with for my Zonelets blog is that the Blog title and Date aren't showing up automatically, despite there being divs for them and I am labeling the html files appropriately. If I type something in the divs the text will not appear on my page. Im assuming it is a Javascript error? I don't know how to fix it tho, do you an idea?

pixelglade's avatar pixelglade 2 years ago

I do have an idea, actually. The first issue is that if you deviate from the template too much or decide to not use on the the variables in the script file, it can break the Javascript that Zonelets uses. For that reason (and because the Javascript was a bit slow sometimes) I actually removed the Javascript from the blog and replaced it with HTML, but I kept a lot the styling divs the same.

1 like
pixelglade's avatar pixelglade 2 years ago

I kept the footer for zonelets because that's how I started with my blog, but it's deviated from the original code a fair bit. I think it was actually the blog title and date issues that made me remove all the Javascript. But I would recommend editing the template file first and testing with that to try troubleshoot. Not sure if that's super helpful, but in the end - it probably is an issue with the Javascript.

1 like
sugarblush's avatar sugarblush 2 years ago

Thank you so much for the suggestion!! I removed the Javascript on the Post Template and I'll continue fiddling around with it while referencing your code c:

sugarblush's avatar sugarblush 2 years ago

Something I'm trying to achieve on my home page is a cute header banner like yours but with my own pixel art. I copied your code and replaced the background image file with mine, but the banner appears as blank. Do you know what is going on? (Thank you so much for all the help by the way, I hope I am not troubling you)

pixelglade's avatar pixelglade 2 years ago

in terms of the background image, check that it's in the root directory of the website. Check the path and file name are correct "./" in the css style file means it's looking in the root directory. Also check the height and width arguments are correct with units (px). You don't have to load the image as a background image, you can load it as an image in HTML in the file instead if you want.

1 like
pixelglade's avatar pixelglade 2 years ago

When I tried looking for your background image by navigating to the filename I got a 404 error so I think the path is probably wrong. The paths are all relative, you can read about it here: https://www.w3schools.com/Html/html_filepaths.asp

1 like
pixelglade's avatar pixelglade 2 years ago

Since you're using my code as a base/reference, I'd appreciate it if you could mention it somewhere on your site like "this website layout was inspired by pixelglade's site" with a link to my site - that's just the terms of the Creative Commons license, you can remix and build upon the content or alter it but attribution is usually required. Whenever your website is finished, I'd appreciate the mention. 🙂

1 like
sugarblush's avatar sugarblush 2 years ago

Thank you a lot for the help!! I'll double check the path to make sure I get it right. And yes absolutely! I'll be sure to give a link back to pixelglade on my main page since I am referencing your code :) thank you for letting me use it to learn, I appreciate it.

1 like
pixelglade's avatar pixelglade 2 years ago

You're welcome! Let me know if you have any more questions.

1 like
sugarblush's avatar sugarblush 2 years ago

Hi again! I've made a lot of progress on my site that I'm very happy with c: Thank you for letting me learn from your code. I have three minor things on my site I want to debug.

sugarblush's avatar sugarblush 2 years ago

First two have to do with responsive design; I want to achieve the equally spaced nav box effect your site has on mobile. I referenced your code, but on my phone my site's "About" box is too squished, making the text feel crammed, while my "Projects" box is too spread out. My "Misc" box seems just fine though. What can I do to even out the "about" and "projects" boxes?

sugarblush's avatar sugarblush 2 years ago

The second thing on mobile; if I swipe on my phone it will reveal that there is extra unused space to the right of my page. I was looking stuff up, and I think it comes from me adding padding to a box that had "width=100%" for responsive design. I can't seem to find the offending box though. This extra space on mobile isn't something present on your site, do you know how you prevented this?

sugarblush's avatar sugarblush 2 years ago

The last thing is very minor, but something I notice on my home page is that there is some extra space between the start of the content box and my beginning header. I checked the css for h2 but I can't find any extra padding, so I'm not sure what is going on. Do you have any ideas?

sugarblush's avatar sugarblush 2 years ago

Sorry for all the questions haha, thank you a lot for all the help. Wishing you the best

pixelglade's avatar pixelglade 2 years ago

In regards to the size of the nav box in mobile when it's running along the top, it's set to fill 100% of the space. It looks like the middle column might be larger is due to the line length- the Pokemon: Sceptre/Spear could be the culprit, I generally tried to keep all my heading names roughly a similar length for that reason. A way to test is to temporarily remove all the headings and see what the columns look like

1 like
pixelglade's avatar pixelglade 2 years ago

I recommend testing your website in a browser and you can do Right Click > Inspect (Q) and then hover the mouse over different elements. When I did this, I found your h1 banner is what is causing the extra space on the right. If you click the element in this mode you can see a highlight for what the padding is, the position, etc.

1 like
pixelglade's avatar pixelglade 2 years ago

My suspicion is the extra space and the header positioning are related issues, if you solve one it might fix the other. The inspect says it's the h1.banner element rather than the header so I'd look into that.

1 like
pixelglade's avatar pixelglade 2 years ago

So don't get me wrong, testing on mobile is important but for narrowing down issues with elements you can resize your browser window to be squished and it will have approximately the same effect which can help you search for issues this way with Inspect.

1 like
sugarblush's avatar sugarblush 2 years ago

Thank you so much! Your responses helped me fix all of those issues c:

1 like
sugarblush's avatar sugarblush 2 years ago

Hi again! c: I am trying to create "favorite things" sections with booktable grids like yours. But one issue I am running into is that when I resize my browser window, the .bookdescription text will go off of the page. Do you know how to keep it in the main container?

pixelglade's avatar pixelglade 2 years ago

Hello~ I actually had this problem with css-grid as well but I never got around to fixing it. In other parts of the site where I have tables (e.g. guestbook, resources root pages) I use just html tables that are set to fit the window. You could try something like that instead, sorry I can't be more help about this right now.

1 like
sugarblush's avatar sugarblush 2 years ago

No need to be sorry at all! Thanks for the suggestion c: I'll see what I can do

1 like
ok that was almost a mess but i think i have everything relinked... new homepage :)
2 likes
Amazing artwork! :)
1 like
Got spammed to hell again so I deleted my Guestbook
1 like

Popular Tags

art   music   videogames   programming   anime   games   food   personal   writing   cats   blog   movies   books   gaming   fashion   photography   comics   design   animation   horror   game   drawing   coding   manga   furry   portfolio   technology   poetry   cute   ocs   reading   arte   kpop   education   programacion   history   animals   musica   sports   film   fun   roblox   literature   html   philosophy   programing   nature   science   tech   travel   web   videogame   politics   minecraft   gamedev   retro   school   computers   youtube   cartoons   pokemon   videojuegos   life   2000s   love   blogging   video   illustration   fantasy   diary   dogs   pink   random   comic   memes   internet   gardening   videos   idk   test   linux   webcomic   queer   nostalgia   oc   kawaii   cooking   y2k   tv   ai   arg   news   fandom   aesthetic   fanfiction   emo   business   journal   worldbuilding   cars   health   silly   learning   vocaloid   stuff   crafts   media   math   space   fiction   films   90s   stories   website   scifi   css   cutecore   football   cat   culture   graphics   etc   painting   arts   homestuck   software   marketing   lgbt   goth   punk   sanrio   baking   3d   commissions   journaling   pixelart   sport   archive   artist   crochet   digitalart   cinema   psychology   me   diy   program   characters   dance   funny   dnd   religion   metal   comida   trans   lgbtq   makeup   javascript   graphicdesign   cool   entertainment   shows   fanart   development   streaming   sonic   code   scene   aboutme   editing   rpg   series   friends   creativity   indie   webcomics   clothes   lifestyle   story   roleplay   plants   comedy   guitar   webcore   weird   languages   gay   hacking   electronics   zines   webdesign   rock   ttrpg   educacion   cyberpunk   everything   reviews   community   informatica   aesthetics   study   sewing   engineering   basketball   computer   soccer   it   beauty   originalcharacters   oldweb   fnaf   social   weirdcore   vtuber   discord   spirituality   vintage   pets   vaporwave   project   photos   about   shop   information   movie   clothing   architecture   storytelling   coffee   nintendo   language   html5   flowers   blogs   testing   deltarune   japan   undertale   shopping   mlp   magic   biology   cosplay   money   crypto   thoughts   digital   fitness   radio   blinkies   creative   lore   book   nothing   hobbies   ttrpgs   experimental   chat   tecnologia   physics   info   cybersecurity   furries   bugs   astronomy   alternative   japanese   websites   singing   resume   site   witchcraft   birds   other   occult   autism   wip   fandoms   futbol   lain   juegos   finance   anything   research   profile   band   dolls   television   sleeping   gamedevelopment   vr   sleep   events   theatre   system   ghchs   projects   tvshows   apps   work   crafting   genshin   linguistics   webdevelopment   photo   splatoon   carrd   personalwebsite   python   vampires   fish   transgender   dreams   free   all   meme   knitting   interests   rap   toys   developer   astrology   fanfic   windows   pixels   puzzle   mentalhealth   aliens   fortnite   wiki   yaoi   deportes   robots   app   drawings   collecting   dog   touhou   family   animations   coquette   a   moda   cartoon   dancing   bio   poems   security   romance   stamps   english   tarot   skateboarding   visualnovels   marvel   gothic   pizza   fnf   online   intro   links   modding   humor   adventure   hiking   mathematics   data   osc   interactive   medicine   gatos   teaching   characterdesign   lol   journalism   essays   roleplaying   gallery   fansite   no   frutigeraero   gamedesign   dragons   mystery   gyaru   gym   chess   animes   rp   twitch   creepypasta   zine   zonelets   hobby   objectshows   gifs   resources   jfashion   pixel   breakcore   ffxiv   home   scenecore   meow   tf2   twine   privacy   mythology   death   dreamcore   noise   puzzles   hiphop   ocean   law   traveling   vkei   popculture   musicals   graphic   android   myself   podcast   novels   danganronpa   birthday   progamming   blender   audio   piano   introduction   recipes   rpgs   dark   communism   ecommerce   swag   yuri   bfdi   robotics   car   stars   hellokitty   plushies   shrine   socialmedia   awesome   indiegames   style   activism   pictures   none   deporte   paranormal   omori   production   boardgames   pjsk   studying   educational   girls   running   lolita   foods   jogos   electronic   christianity   misc   bitcoin   student   bunnies   wrestling   things   utau   jewelry   mario   lesbian   feminism   anarchism   travelling   spanish   old   scratch   god   vent   webdev   computing   filmmaking   clowns   sharks   outdoors   80s   store   geography   unblocked   realestate   java   designing   dev   maths   volleyball   flash   grunge   vtubers   doom   images   pinterest   pc   jpop   songs   craft   starwars   3dmodeling   peliculas   environment   college   help   transformers   dinosaurs   tumblr   brasil   creepy   stickers   trains   amor   cafe   tools   collage   bts   epic   computerscience   event   escuela   jazz   baseball   yoga   translation   warriorcats   plurality   novel   chemistry   collection   pastel   blue   services   acting   bl   js   cyber   construction   programar   southpark   persona   cine   programas   lego   multimedia   mcr   retrogaming   tabletop   tcc   tea   monsters   podcasts   jesus   libros   otherkin   forum   theater   gamer   estudiante   fotografia   therian   horses   weed   yes   truecrime   whatever   videoediting   techno   supernatural   args   enstars   shoes   medical   trading   hardware   weather   skating   pop   miku   alt   homepage   programmer   search   turismo   insects   angels   cricket   curso   freedom   videography   cozy   kirby   salud   opensource   vlog   tiktok   people   skincare   hi   dc   learn   kidcore   socialism   modeling   maps   economics   manhwa   closedspecies   lgbtqia   drama   surrealism   halloween   swimming   draw   sound   kandi   dj   historia   vhs   restaurant   digitalmarketing   bsd   f1   ecology   petz   service   shitposting   artwork   ideas   ropa   world   hockey   tourism   animanga   green   girly   text   analysis   tattoos   fishing   depression   furniture   author   conspiracy   bible   edm   egl   nerd   cv   animales   drugs   blockchain   cleaning   rats   literatura   homework   cultura   did   academia   healthcare   racing   frogs   tennis   surreal   plural   chatting   women   mobile   cryptocurrency   scary   3dprinting   chill   bands   trinkets   general   academic   kdrama   sculpture   whimsy   sciencefiction   videogaming   informacion   friendship   species   hair   brazil   programa   hardcore   library   tutorials   networking   filmes   wedding   truth   knowledge   christian   alterhuman   rpgmaker   visualnovel   sociology   miriadax   eating   soft   foss   water   analog   ghosts   genshinimpact   estudio   mods   ambient   practice   glitch   thrifting   society   creation   aviation   programacao   anarchy   university   css3   server   gacha   quotes   retrogames   conlang   colors   erotica   jjba   cryptids   company   onepiece   google   sustainability   ux   sites   livros   anthropology   batman   guns   graffiti   cycling   live   bot   sketching   class   artes   programs   review   noticias   twitter   purple   neocities   revival   schoolproject   kids   character   wellness   cs   writer   garden   blood   instagram   lostmedia   shitpost   advertising   crime   bikes   medieval   archives   theology   startrek   superheroes   webseries   harrypotter   forsaken   mangas   vampire   camping   esoteric   magazine   theory   writting   frontend   dating   animal   industrial   tattoo   analoghorror   otaku   disney   play   rhythmgames   articles   cards   evangelion   church   rants   3dart   ultrakill   talking   nails   meditation   os   interactivefiction   training   idols   performance   synthesizers   spiderman   future   building   prompts   handmade   liminal   ceramics   house   unblockedgames   apple   jobs   illustrations   datascience   youtuber   spooky   content   yapping   shrines   tecnology   tareas   viajes   tarea   finalfantasy   decor   party   originalcharacter   french   chaos   concerts   notes   designer   communication   selfship   exercise   crocheting   doodles   zelda   silliness   shoegaze   facts   rambling   voiceacting   new   vrchat   magick   paganism   hack   satire   disability   mylittlepony   cult   something   entretenimiento   calculator   desing   neopets   embroidery   animalcrossing   sims   repair   rainbow   jokes   geek   photoshop   cheese   musicproduction   folklore   tic   download   creatures   visualkei   desarrollo   overwatch   halflife   miscellaneous   joke   creating   php   developing   marxism   black   terror   anthro   spiritual   sweets   tokipona   kink   commission   vtubing   military   club   conlangs   ar   vinyl   scp   shifting   trabajo   vegan   private   quiz   webring   crk   bass   self   happy   hotel   mtg   projectsekai   oldroblox   archival   tips   pet   agriculture   adhd   musics   vlogs   beach   more   kdramas   yugioh   beginner   seals   tokusatsu   doctorwho   islam   arcane   scrapbooking   mushrooms   animating   songwriting   index   generator   csgo   lolitafashion   map   ranfren   secret   motorcycles   underground   mecha   creativewriting   drinks   casino   kin   zombies   4chan   rave   gender   stupid   hosting   musician   collections   words   randomstuff   vibes   time   red   cities   studies   beer   tamagotchi   1   city   products   lofi   edits   mha   fanfics   sanat   tutorial   ciencia   proyecto   ui   dungeonsanddragons   productivity   daily   retrocomputing   streamer   oldinternet   riddle