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