{"id":123,"date":"2025-10-27T21:57:22","date_gmt":"2025-10-27T21:57:22","guid":{"rendered":"https:\/\/wp.odu.edu\/odupresentationtemplate\/?page_id=2"},"modified":"2025-12-04T02:18:42","modified_gmt":"2025-12-04T06:18:42","slug":"sample-page","status":"publish","type":"page","link":"https:\/\/sites.wp.odu.edu\/307t\/","title":{"rendered":"&#8212;&#8212;&#8212;&#8212;&#8212;HOME\/ABOUT ME&#8212;&#8212;&#8212;&#8212;&#8212;"},"content":{"rendered":"\n<p class=\"has-text-align-center\"><strong><em>Welcome to My Digital Writing Portfolio<\/em><\/strong><\/p>\n\n\n\n<p>Hi! My name is William Fulmer, and this site was created for ENGL 307T: Digital Writing at Old Dominion University. This website showcases the skills I\u2019ve developed throughout the semester, including creating multimedia content, designing accessible web pages, and experimenting with interactive writing.<\/p>\n\n\n\n<p>This semester has been unforgettable for reasons far beyond coursework\u2014we recently welcomed our baby girl into the world, and she arrived so quickly that I ended up delivering her at home. It was an intense and incredible experience, and now we get to celebrate Christmas as a family of four with our three-year-old son and our newborn daughter. If you haven\u2019t already noticed, I love Christmas, and this year it feels even more special.<\/p>\n\n\n\n<p>As a student at Old Dominion University, I\u2019m continually strengthening my digital communication and writing skills. I enjoy creating content that is clear, practical, and easy for people to understand\u2014whether it\u2019s instructional, technical, or project-based writing. Through this course, I\u2019ve gained experience using tools like WordPress, Canva, AI platforms, and multimedia editors to produce visually engaging and user-friendly content.<\/p>\n\n\n\n<p>I\u2019m always open to collaborating with student organizations, campus departments, or professional groups that may benefit from support with writing, tutorials, or digital communication. My goal is to keep developing as a writer who can blend clarity, design, and technology to communicate effectively and create meaningful digital experiences.<\/p>\n\n\n\n<p>\n<!-- \u2744 Snow overlay + background music \ud83c\udfb5 -->\r\n<div id=\"snow-overlay\"><\/div>\r\n\r\n<audio id=\"bgMusic\" preload=\"auto\" loop>\r\n  <source src=\"https:\/\/www.dropbox.com\/scl\/fi\/zq3x8ag7x2snkri35klha\/Michael-Bubl-It-s-Beginning-To-Look-A-Lot-Like-Christmas-Official-HD-Audio.mp3?rlkey=5wv5drqdm22hxmnqn3yv1qzdv&st=3479592k&raw=1\" type=\"audio\/mpeg\">\r\n<\/audio>\r\n\r\n<style>\r\n  \/* Full-page snow overlay *\/\r\n  #snow-overlay {\r\n    position: fixed;\r\n    inset: 0;\r\n    pointer-events: none;   \/* don't block clicks *\/\r\n    z-index: 9998;\r\n    overflow: hidden;\r\n  }\r\n\r\n  .snowflake {\r\n    position: fixed;\r\n    top: -40px;\r\n    color: #ffffff;\r\n    font-size: 14px;\r\n    opacity: 0.85;\r\n    text-shadow:\r\n      0 0 4px rgba(255, 255, 255, 0.8),\r\n      0 0 8px rgba(180, 220, 255, 0.9);\r\n    animation-name: snow-fall;\r\n    animation-timing-function: linear;\r\n    animation-fill-mode: forwards;\r\n  }\r\n\r\n  @keyframes snow-fall {\r\n    0% {\r\n      transform: translateY(-40px) translateX(0) rotate(0deg);\r\n    }\r\n    50% {\r\n      transform: translateY(50vh) translateX(15px) rotate(180deg);\r\n    }\r\n    100% {\r\n      transform: translateY(110vh) translateX(-15px) rotate(360deg);\r\n    }\r\n  }\r\n<\/style>\r\n\r\n<script>\r\ndocument.addEventListener(\"DOMContentLoaded\", function () {\r\n  \/* \ud83c\udfb5 Background music autoplay (with fallback on click\/touch) *\/\r\n  const audio = document.getElementById(\"bgMusic\");\r\n  audio.volume = 0.4; \/\/ adjust if you want louder\/softer\r\n\r\n  function tryPlayMusic() {\r\n    audio.play().catch(() => {\r\n      \/\/ If autoplay is blocked, start on first click\/touch\r\n      const resume = () => {\r\n        audio.play().catch(() => {});\r\n        document.removeEventListener(\"click\", resume);\r\n        document.removeEventListener(\"touchstart\", resume);\r\n      };\r\n      document.addEventListener(\"click\", resume);\r\n      document.addEventListener(\"touchstart\", resume);\r\n    });\r\n  }\r\n\r\n  tryPlayMusic();\r\n\r\n  \/* \u2744 Continuous falling snowflakes *\/\r\n  const overlay = document.getElementById(\"snow-overlay\");\r\n\r\n  function createSnowflake() {\r\n    const flake = document.createElement(\"span\");\r\n    flake.className = \"snowflake\";\r\n    flake.textContent = \"\u2744\";\r\n\r\n    const startLeft = Math.random() * 100; \/\/ vw\r\n    const duration = 8 + Math.random() * 8; \/\/ 8\u201316s\r\n    const size = 10 + Math.random() * 16; \/\/ 10\u201326px\r\n    const drift = (Math.random() - 0.5) * 30; \/\/ little side drift\r\n\r\n    flake.style.left = startLeft + \"vw\";\r\n    flake.style.fontSize = size + \"px\";\r\n    flake.style.animationDuration = duration + \"s\";\r\n\r\n    \/\/ Tiny random delay so they don't all start at once\r\n    flake.style.animationDelay = (Math.random() * 3) + \"s\";\r\n\r\n    overlay.appendChild(flake);\r\n\r\n    \/\/ Remove from DOM after animation to avoid buildup\r\n    setTimeout(() => {\r\n      flake.remove();\r\n    }, (duration + 3) * 1000);\r\n  }\r\n\r\n  \/\/ Create snowflakes regularly\r\n  setInterval(() => {\r\n    \/\/ Adjust count here for more\/less snow\r\n    createSnowflake();\r\n    createSnowflake();\r\n  }, 600); \/\/ every 0.6s\r\n});\r\n<\/script>\n<\/p>\n\n\n\n<p>\n<!-- \ud83c\udf84 Slow Back-and-Forth Song Banner with Light Snowline -->\r\n<div class=\"song-banner-container\">\r\n  <div class=\"song-banner\">\r\n    Michael Bubl\u00e9 \u2013 It\u2019s Beginning to Look a Lot Like Christmas\r\n  <\/div>\r\n\r\n  <!-- LIGHT SNOWLINE (original amount) -->\r\n  <div class=\"snowline\">\r\n    \u2744 \u2744 \u2744 \u2744 \u2744 \u2744 \u2744 \u2744 \u2744 \u2744 \u2744 \u2744 \u2744 \u2744 \u2744\r\n  <\/div>\r\n<\/div>\r\n\r\n<style>\r\n\/* Container fixed to bottom *\/\r\n.song-banner-container {\r\n  position: fixed;\r\n  bottom: 0;\r\n  left: 0;\r\n  width: 100%;\r\n  z-index: 99999;\r\n  background: rgba(0, 0, 0, 0.55);\r\n  backdrop-filter: blur(4px);\r\n  padding-top: 6px;\r\n  padding-bottom: 8px;\r\n  text-align: center;\r\n  pointer-events: none; \/* Allow clicking through *\/\r\n}\r\n\r\n\/* Song title text \u2014 larger *\/\r\n.song-banner {\r\n  display: inline-block;\r\n  white-space: nowrap;\r\n  color: #fff;\r\n  font-size: 1.45rem;   \/* Larger text size *\/\r\n  font-weight: 700;\r\n  text-shadow: 0 0 6px #ffffff, 0 0 12px #b7dfff;\r\n  animation: banner-slide 20s ease-in-out infinite alternate;\r\n}\r\n\r\n\/* Slow back-and-forth sliding *\/\r\n@keyframes banner-slide {\r\n  0%   { transform: translateX(-30%); }\r\n  50%  { transform: translateX(30%); }\r\n  100% { transform: translateX(-30%); }\r\n}\r\n\r\n\/* Light snowline *\/\r\n.snowline {\r\n  margin-top: 4px;\r\n  font-size: 1.2rem;\r\n  color: #ffffff;\r\n  text-shadow:\r\n    0 0 5px rgba(255, 255, 255, 0.9),\r\n    0 0 8px rgba(200, 220, 255, 0.9);\r\n  letter-spacing: 4px;\r\n}\r\n<\/style>\n<\/p>\n\n\n\n<p>\n<!-- \ud83c\udf84 Slower Bouncing Merry Christmas + Sound On -->\r\n<div id=\"mc-float-layer\">\r\n  <div class=\"mc-bubble mc-main\">Merry Christmas<\/div>\r\n  <div class=\"mc-bubble mc-sound\">Sound On<\/div>\r\n<\/div>\r\n\r\n<style>\r\n  #mc-float-layer {\r\n    position: fixed;\r\n    inset: 0;\r\n    pointer-events: none;\r\n    z-index: 99990;\r\n  }\r\n\r\n  .mc-bubble {\r\n    position: fixed;\r\n    padding: 0.4rem 0.9rem;\r\n    border-radius: 999px;\r\n    font-family: system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif;\r\n    font-weight: 700;\r\n    font-size: 1.1rem;\r\n    color: #ffffff;\r\n    text-shadow: 0 0 6px rgba(0, 0, 0, 0.7);\r\n    box-shadow: 0 0 10px rgba(0, 0, 0, 0.45);\r\n    white-space: nowrap;\r\n  }\r\n\r\n  .mc-main {\r\n    background: linear-gradient(45deg, #b91c1c, #22c55e);\r\n    border: 2px solid rgba(255, 255, 255, 0.7);\r\n  }\r\n\r\n  .mc-sound {\r\n    background: linear-gradient(45deg, #0ea5e9, #22c55e);\r\n    border: 2px solid rgba(255, 255, 255, 0.8);\r\n    font-size: 0.95rem;\r\n  }\r\n<\/style>\r\n\r\n<script>\r\ndocument.addEventListener(\"DOMContentLoaded\", function () {\r\n  const bubbles = [\r\n    {\r\n      el: document.querySelector(\".mc-main\"),\r\n      x: 40,\r\n      y: 100,\r\n      vx: 0.45,   \/\/ MUCH SLOWER horizontal speed\r\n      vy: 0.35    \/\/ MUCH SLOWER vertical speed\r\n    },\r\n    {\r\n      el: document.querySelector(\".mc-sound\"),\r\n      x: 200,\r\n      y: 200,\r\n      vx: -0.40,  \/\/ slower horizontal speed\r\n      vy: 0.45    \/\/ slower vertical speed\r\n    }\r\n  ];\r\n\r\n  function randomizeStart(b) {\r\n    const w = window.innerWidth;\r\n    const h = window.innerHeight;\r\n    b.x = Math.random() * (w * 0.6);\r\n    b.y = Math.random() * (h * 0.6);\r\n\r\n    \/\/ slow random motion\r\n    b.vx = (Math.random() * 0.5 + 0.25) * (Math.random() < 0.5 ? -1 : 1);\r\n    b.vy = (Math.random() * 0.5 + 0.25) * (Math.random() < 0.5 ? -1 : 1);\r\n  }\r\n\r\n  bubbles.forEach(randomizeStart);\r\n\r\n  function animate() {\r\n    const w = window.innerWidth;\r\n    const h = window.innerHeight;\r\n\r\n    bubbles.forEach(b => {\r\n      const rect = b.el.getBoundingClientRect();\r\n      const bw = rect.width || 150;\r\n      const bh = rect.height || 40;\r\n\r\n      b.x += b.vx;\r\n      b.y += b.vy;\r\n\r\n      if (b.x <= 0) {\r\n        b.x = 0;\r\n        b.vx *= -1;\r\n      } else if (b.x + bw >= w) {\r\n        b.x = w - bw;\r\n        b.vx *= -1;\r\n      }\r\n\r\n      if (b.y <= 0) {\r\n        b.y = 0;\r\n        b.vy *= -1;\r\n      } else if (b.y + bh >= h) {\r\n        b.y = h - bh;\r\n        b.vy *= -1;\r\n      }\r\n\r\n      b.el.style.transform = `translate(${b.x}px, ${b.y}px)`;\r\n    });\r\n\r\n    requestAnimationFrame(animate);\r\n  }\r\n\r\n  animate();\r\n});\r\n<\/script>\n<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Welcome to My Digital Writing Portfolio Hi! My name is William Fulmer, and this site was created for ENGL 307T: Digital Writing at Old Dominion University. This website showcases the skills I\u2019ve developed throughout the semester, including creating multimedia content,&#8230; <a class=\"more-link\" href=\"https:\/\/sites.wp.odu.edu\/307t\/\">Continue Reading &rarr;<\/a><\/p>\n","protected":false},"author":31707,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"open","template":"","meta":{"footnotes":""},"_links":{"self":[{"href":"https:\/\/sites.wp.odu.edu\/307t\/wp-json\/wp\/v2\/pages\/123"}],"collection":[{"href":"https:\/\/sites.wp.odu.edu\/307t\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/sites.wp.odu.edu\/307t\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/sites.wp.odu.edu\/307t\/wp-json\/wp\/v2\/users\/31707"}],"replies":[{"embeddable":true,"href":"https:\/\/sites.wp.odu.edu\/307t\/wp-json\/wp\/v2\/comments?post=123"}],"version-history":[{"count":5,"href":"https:\/\/sites.wp.odu.edu\/307t\/wp-json\/wp\/v2\/pages\/123\/revisions"}],"predecessor-version":[{"id":266,"href":"https:\/\/sites.wp.odu.edu\/307t\/wp-json\/wp\/v2\/pages\/123\/revisions\/266"}],"wp:attachment":[{"href":"https:\/\/sites.wp.odu.edu\/307t\/wp-json\/wp\/v2\/media?parent=123"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}