Link to new HTML page in same root folder not working - html

Forgive the stupid question -- i know i'm doing something retarded, but I'm kinda stuck.
I'm a complete newbie -- and I inherited this website that is build on spring, thymeleaf, hibernate, java and a bunch of other technologies that i'm still learning. The original developer will not take my calls.
All the development is being done on Eclipse -- and I can get the existing project to run and build on my laptop.
I'm trying create a new page and link to it from my main default page (index.htlm).
I can create the href tag to an "existing" html file in the root folder.
But when I reference a new html page in the same directory -- the reference goes to 404.
What am I doing wrong.
Here is the original html snip:
<!-- Contractors -->
<div class="col-md-3 col-md-offset-1 col-sm-10 col-sm-offset-1 box-shadow 10px 10px " style="padding: 50px">
<span class="h1 type--bold">Contractors & Handymen</span><span class="h2">Looking for side hustle?</span>
<p class="lead">Be alerted to in-network jobs.</p>
<div class="row">
<div class="col-sm-12 col-xs-12">
<a th:href="#{/company}" href="company.html"
class="btn btn--sm btn--warning"><span
class="btn__text type--uppercase">Register Here</span></a>
</div>
</div>
</div>
I created a page in the same directory as "company.html" the file name is "signUpContractor.html"
And I updated the html snip as such:
<!-- Contractors -->
<div class="col-md-3 col-md-offset-1 col-sm-10 col-sm-offset-1 box-shadow 10px 10px " style="padding: 50px">
<span class="h1 type--bold">Contractors & Handymen</span><span class="h2">Looking for side hustle?</span>
<p class="lead">Be alerted to in-network jobs.</p>
<div class="row">
<div class="col-sm-12 col-xs-12">
<a th:href="#{/signUpContractor}" href="signUpContractor.html"
class="btn btn--sm btn--warning"><span
class="btn__text type--uppercase">Register Here</span></a>
</div>
</div>
</div>
output looks like this:
enter image description here
but when i click the link get this:
enter image description here
do i need to register the page with thymeleaf? or something?
if i reference other pages in the folder (that was existing prior to me taking over) such as "about.html" or "contactUs.html" the href works just fine. But any new page I create will go to 404.
Thanks for the kind soul that can help me navigate this.
Apologize in advance for the newbie question, i'm just out on the deep-end right now.
:-)

Related

Link with href to id on page not including route data

Generating documentation in an ASP.NET Core MVC app. The view renders headings with ids and the contents of other sections needs to link to them.
Example view:
#foreach (MyObject thing in Model)
{
<h5 id="#thing.Name">#thing.Name</h5>
<h6>List</h6>
#foreach (MySubObject otherThing in thing.SubObjects)
{
<div class="row">
<div class="col-md-4 col-sm-6">#otherThing.Name</div>
<div class="col-md-4 col-sm-6">
#if (otherThing.HasParent)
{
<a href="#($"#{otherThing.ParentName}")">
#otherThing.ParentName
</a>
}
</div>
</div>
}
}
This generates exactly what I want it to:
<div class="row">
<div class="col-md-4 col-sm-6">OtherThing7Name</div>
<div class="col-md-4 col-sm-6">
<a href="#ParentName">
ParentName
</a>
</div>
</div>
...
<h5 id="ParentName">ParentName</h5>
But the link, when I hover over it, goes to http://localhost/#ParentName instead of preserving the route data e.g. http://localhost/Documentation/Things#ParentName, so instead of just jumping to that location on the page, it takes it to the root of the application.
Update:
Okay, it looks like this is happening because <base href="~/" /> is defined in the View Layout being used (which all Views in the application use). Removing it allowed the link to work as expected, but I don't know what effects it would have on the rest of the site.

How do I add a logo to my html website? Only showing a little icon instead of the entire pic

Trying to add the 4 dry out logo to this html template. Can anyone correct what I did wrong? It shows this on the site:
This is a very small section of the code where I have the image placed in the body.
<body>
<!-- Loader -->
<div id="loader-wrapper">
<div id="loader"></div>
<div class="loader-section section-left"></div>
<div class="loader-section section-right"></div>
</div>
<!-- Page Content -->
<div class="container-fluid tm-main">
<div class="row tm-main-row">
<!-- Sidebar -->
<div id="tmSideBar" class="col-xl-3 col-lg-4 col-md-12 col-sm-12 sidebar">
<button id="tmMainNavToggle" class="menu-icon">☰</button>
<div class="inner">
<nav id="tmMainNav" class="tm-main-nav">
<ul>
<!--ERROR IMG --> <img data-image="4 Dry Out Logo.jpg" alt="4 Dry Out Logo">
<li>
Unless there is other code acting on your img tag, you need to use the src attribute to specify an image URL. Spaces in the image name could also be causing an issue.
You'll want to open up your web browser's developer tools and see if you can see where the image is requested in the network tab. If the URL is returning a 404 error, you know that there is an issue with your image's path. If the request for the image isn't being made at all, then there is an issue with your img tag or the code that is supposed to cause the request for the image to be sent.
<img data-image="4DryOutLogo.jpg" alt="4 Dry Out Logo">
First you need to consider renaming the image and remove white space from the name.
Second , you have to use the code as below
<img src = "../yourimagename.jpg">
Finally ,
You have to make sure that your image exist with in the server path.
I suggest you to first open the image via url link , once its open copy paste that url into the src code .
Good luck

wordpress Theme is duplicated my page sections

well, I assuming that my wordpress theme is doing that, but I really dont know.
Today I woke up and I was going to continue working on my home page and I saw that some sections are duplicate and I didnt do that.
Its a site with a woocomerce shop and I have an element that is "featured products" when I add it to the layout it duplicates itself. The same happens with all that is below that (instagram caroussel and fotter)
Its like my wordpress added another new page below the home.
This is the page:
https://prueba.soygorrion.com.ar/
enter image description here(also I upload an image)
I dont know what happenned.
This is some of the code that is at the bottom of the page
https://jsfiddle.net/ba2gwnyt/
<div class="vc_row-full-width"></div>
<div class="noo-container-fluid">
<div class="vc_row wpb_row vc_row-fluid">
<div class="wpb_column vc_column_container vc_col-sm-12">
<div class="vc_column-inner ">
<div class="wpb_wrapper">
<div class="wpb_text_column wpb_content_element vc_custom_1559324189503">
<div class="wpb_wrapper">
<h1 style="text-align: left;"><b> PRODUCTOS DESTACADOS </b></h1>
</div>
</div>
<div class="vc_separator wpb_content_element vc_separator_align_center vc_sep_width_100 vc_sep_dotted vc_sep_pos_align_center vc_separator_no_text vc_sep_color_black"><span class="vc_sep_holder vc_sep_holder_l"><span class="vc_sep_line"></span></span><span class="vc_sep_holder vc_sep_holder_r"><span class="vc_sep_line"></span></span>
</div>
<div class="noo-simple-product-wrap">
<ul class="noo-simple-product-slider owl-carousel owl-theme" style="opacity: 1; display: block;">
<div class="owl-wrapper-outer">
<div class="owl-wrapper" style="width: 2928px; left: 0px; display: block; transition: all 800ms ease 0s; transform: translate3d(-366px, 0px, 0px);">
<div class="owl-item" style="width: 366px;">
<li>
<a href="https://prueba.soygorrion.com.ar/tienda/accesorios/bille-triptica-oso/" class="hover-device">
<div class="noo-simple-slider-item">
<img width="650" height="650" src="https://prueba.soygorrion.com.ar/wp-content/uploads/2019/05/billeteraOso5-650x650.jpg" class="attachment-noo-thumbnail-product size-noo-thumbnail-product wp-post-image wp-post-image" alt="" srcset="https://prueba.soygorrion.com.ar/wp-content/uploads/2019/05/billeteraOso5-650x650.jpg 650w, https://prueba.soygorrion.com.ar/wp-content/uploads/2019/05/billeteraOso5-150x150.jpg 150w, https://prueba.soygorrion.com.ar/wp-content/uploads/2019/05/billeteraOso5-32x32.jpg 32w, https://prueba.soygorrion.com.ar/wp-content/uploads/2019/05/billeteraOso5-100x100.jpg 100w"
I already tried to:
-create a new page and the same happened
- get back to and other revision and the same happened
-Delete some of my css to see if that was the reason
-Deactivate plugins
I hope someone can help me
thanks!
In WordPress when you create a page it inherits the layout from the single.php file of your theme, And that is the reason why it's getting duplicated.
So if you want to create a different page then look for "How to make custom page template tutorial which suits your needs"
Check this one for complete beginner
Or just search it over bing or google.
Go into your footer.php first and then index.php
On each page you're going to check that you don't have the following code duplicated. Or duplicated loops or references on these page.
include()
include_once()
require()
require_once()
get_template_part()
Also:
If nothing seems off in the code you may want to check Elementor builder since the duplicated code is generated from Elementor.

WP-API and HTML tags

I'm pulling data from an external site using WP-API and displaying it using AngularJS - http://dev.5874.co.uk/goshooting/search-the-shooting-club-directory/
The data is pulling in fine but it's showing the HTML tags such as how can I stop this? I'm using Advanced custom fields too which may be contributing.
<div ng-controller="northWestCtrl">
<div ng-repeat="d in data">
<h2 class="entry-title title-post">{{d.title}}</h2>
<img src="{{d.acf.logo}}">
<div id="listing-contact">Contact: {{d.acf.contact}}, {{d.acf.position}}</div>
<div id="listing-address-1">
{{d.acf.address_1}}, {{d.acf.address_2}} {{d.acf.address_3}} {{d.acf.town}} {{d.acf.county}} {{d.acf.postcode}}
</div>
<div id="listing-phone">Telephone: {{d.acf.telephone}}</div>
<div id="listing-mobile">Mobile: {{d.acf.mobile}}</div>
<div id="listing-email">Email: {{d.acf.email}}</div>
<div id="listing-website">Website: {{d.acf.website}}</div>
<div id="listing-established">Established: {{d.acf.established}}</div>
<div id="listing-about">About: {{d.acf.about}}</div>
<div id="listing-mailingaddress">Mailing Address: {{d.acf.mailing_address_}}, {{d.acf.mailing_address_2}}, {{d.acf.mailing_address_3}}, {{d.acf.mailing_town}}, {{d.acf.mailing_county}}, {{d.acf.mailing_postcode}}</div>
<div id="listing-directions">Directions: {{d.acf.directions}}</div>
<div id="scd-link">View on The Shooting Club Directory</div>
</div>
</div>
</div>
Here is a working code pen also - http://codepen.io/anon/pen/yePYdq
Any help would be much appreciated, thanks!
If i understand you right you Use this site for getting your data http://scd.blaze.wpengine.com/wp-json/posts?type=listings&filter[listing_area]=northeast with API
Also your console display an error
[Error] XMLHttpRequest cannot load http://scd.blaze.wpengine.com/wp-json/posts?type=listings&filter[listing_area]=northeast. Origin http://dev.5874.co.uk is not allowed by Access-Control-Allow-Origin.
Maybe this link will be helpful Origin is not allowed

Drupal ckeditor not supports some html tags

I am using Ckeditor in Drupal.
I have tried to add the following code in the block content using ckeditor
<header>
<div class="container">
<div class="row">
<div class="col-lg-12">
<img class="img-responsive" src="img/profile.png" alt="">
<div class="intro-text">
<span class="name">Start Bootstrap</span>
<hr class="star-light">
<span class="skills">Web Developer - Graphic Artist - User Experience Designer</span>
</div>
</div>
</div>
</div>
</header>
But the above code displaying like this
<header></header>
Inside contents are not displaying. I don't know what is happening inside. Did anyone know about this?
This has to do with the cleanup and output settings of both Drupal and CKEditor. The fastest and most effective way to achieve this is by creating a new input format, for example "HTML" via /admin/config/content/formats/add with all cleanup processing disabled. This way, your HTML input = HTML output.
Sidenote: Make sure your profile/the admin profile/role is the only role that is able to use it so only trusted users have access to this text-format.