As a favor for a friend, I'm trying to add a quick Valentine's Ad for an article that is supposed to be appended to the top of their existing site starting... tomorrow. They have an existing site made by somebody they are no longer in contact with back in 2010 built with Drupal.
I don't know Drupal. The only information I have is a HostGator login that I'm currently using to send a backup zip to my email.
HostGator's File menu doesn't even show search results for the text I'm searching for on the main page where I'd put this.
I have no idea what I'm doing, basically. I'm comfortable as a web developer in general and figured "yeah I can add a thing to the top of your pages, sure." I can write that HTML quickly, but everything else... do I need Drupal installed, etc, and will that run with the backup that HostGator is gonna send me?
Any advice? I realize I'm an idiot for signing up for a favor like this last minute.
Ultimately I just need to add some pictures and some text.
Easiest way to achieve this would be creating custom block. Not sure what version of Drupal you use, but let's assume it's D7 (similar for other versions):
Go to Structure -> Blocks -> Add block
Enter your static content into "Block body" field. Change that field format to "full html" so drupal won't filter out some of your tags.
If you don't want Drupal's block title to appear in Block title field enter < none > (without space signs in between! - SO can't show it without spaces).
Save your block
Now go to Structure -> Blocks...your block should be visible in block list. You can find and edit it from there.
Theme site uses has "Regions" (something like sidebars). If want your block to appear with main content find your block and select "Content" region. Or any other you want.
At top of that page should be a link "Demonstrate block regions" - click it to see which region is where..
After selecting region you can click "configure" link for your block to precise in what conditions block should appear on page. Click it.
Scroll down and in right sidebar at bottom of configure page you'll see "Pages", "Content types"... it for selecting on what pages, on what content types...your block should be visible. Default is everywhere, so if you need this - use it.
Save block. If you didn't save on Structure -> Block after selecting region select region again and Save.
You can embed your CSS there, but you can also go to (usually): /sites/all/themes/your_theme/styles/style.css or something like that.
If you can't find CSS turn the caching off for a moment: Configuration -> Development -> Performance and inspect location of loaded CSS file(s) (use browser inspection tool).
Good luck!
Related
I am using a bootstrap template for a webpage. I want to customise certain parts of it, but I am struggling to find the CSS rules that relate to the HTML classes because the .css file is so large!
All I can find when searching the web for a solution is ways to search for files rather than within them. It looks as if there was an extension that may have worked, but it doesn't seem to exist any longer.
any help would be hugely appreciated.
You can search over files in VS Code using CTRL/SHIFT/F, more info here
This is from the website:
VS Code allows you to quickly search over all files in the currently opened folder. Press Ctrl+Shift+F and enter your search term. Search results are grouped into files containing the search term, with an indication of the hits in each file and its location. Expand a file to see a preview of all of the hits within that file. Then single-click on one of the hits to view it in the editor.
The simplest way to "find the CSS rules that relate to the HTML classes" is still to open your template/website in a browser -> right click the page and "Inspect Element" -> Find the HTML you need to inspect -> You'll have all the CSS classes and rules involved into styling it ...in the sub-tab "Styles".
simple just "ctrl+f" and type whatever you want to search inside text box show on top right corner.
I am at an impasse with this page I am trying to modify for my institution. The page is somewhat proprietary and not all of the files that comprise the page are accessible to me. The only things I can get access to are 5 different files called a stylesheet(naturally), a head, a top, a bottom, and a print
So this is the page:
http://s5-sandbox.parature.com/ics/support/default.asp?deptID=15028
The issue is that below the page where you have the 2 sections for "Viewed Most Popular Topics" and "Most Recent Topics", is that the words ViewedMost run on together. Additionally the number of views and the first word of the actual topic respective of the views run on together. For example, you'll see 3869What is my Blackboard Username and COM ID?
Given the pages that I have access to, none of them have the ID for that section declared in them. It is in some .ASP page on Parature's backend. I've contacted their support and put in a ticket and did not receive any resolution. I tried emailing someone directly and a man told me something ridiculous:
If you right click on the area and click inspect element you are able to add a space either behind “view” or in
front of “most”. Either works, I’ve tried them both. The same goes for the number and the article.
I already know full well how to use the Chrome inspector but what I told this gentleman was that I don't have access to the page to add a space nor do I even know if there is an element I can use to fix the formatting. I was hoping you guys would be able to see something I do not on the page that would allow me to create the space that I am looking to add.
Thank you all.
.item:after {
content: "\00a0";
}
So I have a custom css drop down menu and it works fine except I realized that writing this menu out across all the html pages on this website will become tedious if I should update with a new section to the website and need to add on a new tier to the menu, I would end up with a billion htmls to update one simple line of code.
I was wondering, is there a way to write this menu once (on the main page) and call on it on all my other htmls?
I experimented a bit with Objects, Iframe, to call on the dropdown menu written on a separate html file and such but when the menu expands you get scroll bars and both methods seem to embed into the page. I want the contents of the page to be behind the drop down menu just as it standardly looks right now.
The following is my unedited page:
http://www.blue-cicada.net/trivial/index.html
And this is my test:
http://www.blue-cicada.net/trivial/test/
Not looking so good there, my top image is obscured, the submenus wont fly out completely etc, how to fix?
Im really new to this stuff so any help is appreciated.
You want to do something server side really, back in the day this would have been http://en.wikipedia.org/wiki/Server_Side_Includes, depending on who is hosting your site it may even still be, though that's fairly unlikely. Chances are you have some provision from your webhost to do something server side, ie PHP Includes say.
If not you could look at doing JavaScript client side includes but its crufty,
If you're really just hand editing you html files and have no access to any server side technologies well, you can always just have a text editor that can search and replace across multiple files
UPDATE
Given your comments I would just download something like Notepad++ and read the Bulk Find and Replace here 'http://www.dedoimedo.com/computers/notepadpp-tricks.html'. Basically you can have a test page you use for figuring out 'what you want to do' and then use the global find and replace to update all of the 'current' versions of the header/menu/whatever to you new version.
Backup all you files first!
Write it in a page called A.html.
On every page where you want to put it, use an <iframe src="A.html">
Make sure you remove the borders of the <iframe>, and also the scrollbars and make it look natural
I've got a simple basic .html document that I'm using for a "My Links.html" local, offline page to use as a way to store hyperlinks to other websites I find interesting. It's kind of like a portable "bookmark" page on the go. Here's some sample code that I've created already:
<b><h3>Web Design Resources</h3></b>
<hr />
<br />
<b><h4><u>CSS Tutorials</u></h4></b>
Line25.com
<ul>
Tutorials
- main tutorials page<br />
Pure CSS Dropdown
- Creating a dropdown menu solely out of css, nothing else (includes sub menus that slide out to the right) <br />
Trendy flat-style-css-menu
- how to create a trendy flat style css menu (hover over "menu image" puts menu title to the right of the images)<br />
Slick Features Comparison Table
- a ghosted (semi transparent) table that vertically compares three items with the categories on the left, box highlight on category font when hovering over any of the text in that row<br />
Simple Collapsing Header Effect
- fixed horizontal menu on top with header text/image that is hidden when scrolling down the page, replaced with the content
Currently I'm manually opening the html document and editing it to add each new link, description and categories (as they come up).
What I'm looking to do is add some simple forms and a submit button to update this offline .html document. I'd like to keep everything contained in the one single document for ease of moving around.
Ideally it'd add text using this format: "hyperlink - description"
With a dropdown of existing categories so that it adds to the correct section. Just a couple text boxes, a dropdown box, and a submit link or button. Nothing fancy, just the bare bones to "get the job done".
Thanks everyone, even if ya can just point me in the right direction or let me know the element names so I can more effectively research what I'm looking to do.
I don't think this will be possible with pure HTML.
You can alter the HTML with Javascript (jQuery) on the client side, but you won't be able to save the changes to your local file system trough Javascript. You can always save the altered document manually if that is an option, but it doesn't seem ideal to me.
For a more solid solution you would need some server side scripting like PHP, and a webserver like Apache running on your local machine (like XAMP or MAMP). And ideally you would need to work with some sort of database or XML file to store the data. Technically it is possible to just alter the HTML but it would be strange and highly uncommon. The XML file will be the easiest for portability, the database will be better for performance (and probably a more useful exercise).
Not sure if this is the best way to handle you 'problem' though. Why not just work with an existing service like Xmarks. You will have access to your bookmarks directly from your browser, can sync them between various machines / browsers, or can access them through their website.
If you are just trying to learn something new however, I encourage the effort. Feel free to ask for any more specific pointers once you decided which route you want to take...
Im using wordpress.com to host my blog. When you click on the site image, it takes you back to the blog home page and not the homepage the belongs to my site.
I know how to change this with an installed wordpress through the editor menu.
However, I dont have any of these option on wordpress.com, however, I have full access to mutate stuff through css.
Is there a way to force CSS to make the changes for me.
Site
However, I want it to read
Site
Just to recap, I dont have an option to change this through the editor. My only option of changing this is through CSS.
I was thinking to use something like this to replace the text inside the herf. But I cant even get it to work with the example text.
Thanks a million.
No - CSS is a read-only way to style page content, not change the content itself (which that tag is a part of).